首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >顶部导航区域中的浮动UL

顶部导航区域中的浮动UL
EN

Stack Overflow用户
提问于 2011-06-28 00:38:33
回答 1查看 200关注 0票数 1

我有两个UL的顶级导航区域。一个向左浮动,一个向右浮动。

在IE7中,右侧的浮动UL似乎一直延伸到左侧,占据了整个可用的空间。在IE8和更新的浏览器中,它当然很好...它们只是扩展了LI中内容的宽度。

示例:

IE7

代码语言:javascript
复制
<---Floated left UL---><----------------------------Floated right UL--->

in IE8
<---Floated left UL--->                         <---Floated right UL--->

我已经尝试过最小宽度和宽度,但似乎不能得到正确的…这是否只是IE7占用整个宽度的默认行为,除非使用设置的像素宽度或百分比进行指定。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2011-06-28 01:40:51

给浮动元素一个宽度(首选)或display:inline。

样式的

代码语言:javascript
复制
.nav {display:inline; background:#CCC;}
ul.nav li {display:inline; margin:0 0.1em;}
#nav1 {float:left;}
#nav2 {float:right;}

HTML

代码语言:javascript
复制
<ul id="nav1" class="nav">
    <li>Lorem</li>
    <li>Ipsum</li>
    <li>Dolor</li>
</ul>
<ul id="nav2" class="nav">
    <li>Sit amet</li>
    <li>Consectetur</li>
    <li>Adipiscing</li>
</ul>

显然,您需要更多地设置列表的样式;我为上下文提供了一些样式。顺便说一句,IE不能识别最小宽度。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/6496048

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档