我遇到了在无序列表中正确显示项目的问题。标签向左浮动,长度较长的相关跨度包裹并显示在标签下方。我需要一个解决方案,将相关的跨度保持在各自的列中。换句话说,我不希望在标签下显示长跨度。我可以利用什么属性,以便在所有流行的浏览器中获得所需的布局,包括IE6?在此先感谢您的帮助。
我的代码如下:
<ul>
<li>
<label>Name</label>
<span><%= Html.Encode(Model.Name) %></span>
</li>
<li>
<label>Entity</label>
<span><%= Html.Encode(Model.Entity) %></span>
</li>
<li>
<label>Phone</label>
<span><%= Html.Encode(Model.Phone) %></span>
</li>
</ul>
我的CSS样式如下:
ul
{
display:block;
list-style-type:none;
margin:0;
padding:0;
}
ul li label
{
float:left;
width:100px;
}
答案 0 :(得分:1)
这适用于Firefox。它也适用于IE6。
ul li span {
display: block;
margin-left: 100px;
}