使li不会因为div宽度限制而换行该怎么实现?
代码：<html><head><metacharset="utf-8"><title>无标题文档</title></head><styletype="text/css">...
代码：
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<style type="text/css">
li{float:left; display:block; margin:10px;}
</style>
<body>
<div style="width:300px; height:300px; background:#066;">
<div style="height:100px; background:#FF0;">
<ul style="display:block;">
<li>a</li><li>b</li><li>c</li><li>d</li><li>e</li><li>f</li><li>g</li><li>h</li><li>i</li><li>j</li><li>k</li><li>l</li><li>m</li><li>n</li><li>o</li><li>p</li><li>q</li><li>r</li><li>s</li><li>t</li><li>u</li><li>v</li><li>w</li><li>x</li><li>y</li><li>z</li>
</ul>
</div>
</div>
</body>
</html>
li那里就是从a~z
这么运行，输出的结果入下
和明显，li因为div的宽度问题，到了j换行了。
我想要的效果是下面这个，这张图是我将ul宽度强制设置为1000px后额效果，
在不强制ul的宽度的情况下，怎么实现这个效果？ 展开
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<style type="text/css">
li{float:left; display:block; margin:10px;}
</style>
<body>
<div style="width:300px; height:300px; background:#066;">
<div style="height:100px; background:#FF0;">
<ul style="display:block;">
<li>a</li><li>b</li><li>c</li><li>d</li><li>e</li><li>f</li><li>g</li><li>h</li><li>i</li><li>j</li><li>k</li><li>l</li><li>m</li><li>n</li><li>o</li><li>p</li><li>q</li><li>r</li><li>s</li><li>t</li><li>u</li><li>v</li><li>w</li><li>x</li><li>y</li><li>z</li>
</ul>
</div>
</div>
</body>
</html>
li那里就是从a~z
这么运行，输出的结果入下
和明显，li因为div的宽度问题，到了j换行了。
我想要的效果是下面这个，这张图是我将ul宽度强制设置为1000px后额效果，
在不强制ul的宽度的情况下，怎么实现这个效果？ 展开
展开全部
不考虑脱离文档流的话，就给ul加个position:absolute 吧
追问
嗯，可以了
请问，什么叫脱离文档流啊？
额外问个问题，在最初不能换行的情况下我给黄色的那个div加了一个overflow：hidden属性，然超出他的部分直接被剪裁掉不显示。
但是给ul加了position:absolute上一层div的overflow属性就没有效果，这该怎么办呢？
我曾经考虑过使用iframe这样或许会简单点，但是在刷新的时候会闪动效果不是很好，除非实在没办法了，我不太想使用这个方法
追答
不是很准确，不过大致上就是这样了。因为脱离了文档流，ul就不受外层的div的overflow控制了
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
