请看下面的图片。由于某种原因,最后一个div(“时间”部分)与IE中的其余部分不一致。我只希望它与其余控件保持一致,例如在Chrome中显示。





IE9和IE10


ASP.NET
 

       <label>Rate:</label>
       <asp:DropDownList runat="server" ID="ddlRateType" title="" AppendDataBoundItems="true"></asp:DropDownList>

   </div>


   <div class="line-content">
       <label>Date:</label>
       <asp:DropDownList runat="server" ID="ddlCaptureDate"></asp:DropDownList>

   </div>
   <div class="line-content" style="width:220px">
       <label>Time:</label>
       <asp:TextBox runat="server" ID="txtHours" Text="0" ClientIDMode="Static" MaxLength="2"></asp:TextBox>
       <asp:DropDownList CssClass="small-dropdown" runat="server" ID="ddlMinutes">
            <asp:ListItem Value="0" Text="0" Selected="True"></asp:ListItem>
           <asp:ListItem Value="25" Text="15"></asp:ListItem>
           <asp:ListItem Value="5" Text="30"></asp:ListItem>
           <asp:ListItem Value="75" Text="45"></asp:ListItem>
       </asp:DropDownList>
   </div>


的CSS

.form-capture{
padding:10px;
border-bottom: 1px solid #eee;
}
.form-capture label{
width: 70px;
padding-top:5px;
display: inline-block;

vertical-align:central;

}

.form-capture div{
display:inline-block;
margin-top:10px;

}
.line-content{
display:inline;
width:262px;

}

.small-dropdown.selectboxit, .small-dropdown.selectboxit + .selectboxit-options{
 width: 20px;
 min-width:20px;
}
.form-capture #txtHours {
 padding: 0 5px 0 0 ;
 background: #e8eaeb;
 border-top: 1px double #DDD;
 border-left: 1px double #DDD;
 border-bottom: 1px double #DDD;
 border-radius:6px 0 0 6px;
 border-color: #e6e6e6 #e6e6e6 #bfbfbf;
 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
 border-bottom-color: #b3b3b3;
 height: 25px;
 width:40px;
 outline: none;
 text-align:right;
 margin-left:4px
 }
 .form-capture #txtComment {
 padding: 0 0 0 5px;
 background: #FFF;
 border-top: 1px double #DDD;
 border-left: 1px double #DDD;
 border-bottom: 1px double #DDD;
 border-radius:6px;
 border-color: #e6e6e6 #e6e6e6 #bfbfbf;
 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
 border-bottom-color: #b3b3b3;
 height: 25px;
 outline: none;

 }

最佳答案

它可能解决了您的问题:

.line-content{
   display:inline-block;
   line-height : 24px; /*for example*/
   width:262px;
}


否则,可能会检查填充,因为EI不会显示相同的尺寸。

关于html - HTML Last div不合适,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/18373373/

10-12 07:39
查看更多