Question

从桌面查看我的标签和两个文本框控件水平对齐。但是，当用户在移动设备上查看网站时，我希望文本框堆叠在一起。我正在使用媒体查询来调整移动视图。所有其他行堆栈都很好（标签下面有文本框）地址的问题是我有两个文本框，我希望每行一个。有什么建议？有任何问题让我知道谢谢

当前CSS

.row { clear: none; width: 100%; overflow: hidden; margin: 5px 0; } 
.label { float: left; text-align: right; margin-right: 10px; width: 130px;} 
.value { float: left; text-align: left;}

HTML

<div class="row"> 
    <div class="label"> 
            <asp:Label ID="lblSiteAddress" runat="server" Text="Site Address"></asp:Label>
     </div>
     <div id="value"> 
            <asp:TextBox ID="txtSiteAddress" runat="server" Width="192px" Height="22px"></asp:TextBox>
            <asp:TextBox ID="txtSiteAddress2" runat="server" Width="192px" Height="22px"></asp:TextBox>![enter image description here][1]
     </div> 
</div >

Answer 1

试试这个：

.value input[type='text'] {
    display: block;
    clear: both;
    /* Additional style here */
}

移动视图上的堆栈控件

1 个答案: