div在浮动css后折叠 [英] Div collapse after float css

查看:144
本文介绍了div在浮动css后折叠的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个名为NAV的div,在NAV的内部,我有一个UL与5 li,我漂浮在左边,li的,但是当我这样做的NAV崩溃。我知道这是因为我在NAV周围设置了一个边框,看看它是否崩溃。以下是示例。



collapsed http://img401.imageshack.us/img401/8867/collapsedze4.png



没有折叠http://img71.imageshack.us/img71/879/nocollapsedkx7.png



,您可以在第一个图像中看到,NAV div中的链接将左移,
黑色边框ontop是实际的div,称为NAV。


$ b $



这里是一些我使用的html和css。

p>

alt text http:// img301 .imageshack.us / img301 / 5514 / codejc8.png

  #nav #ulListNavi a {
float:left;
}


解决方案

添加任何溢出 以外的值

$

  div#nav {overflow:auto; } 

然后添加 width

  div#nav {width:100%; overflow:auto; } 


I have a div called NAV and inside of NAV I have an UL with 5 li which I float to the left, the li's that is but when I do that the NAV collapses. I know this because I put a border around NAV to see if it collapses and it does. Here is the example.

collapsed http://img401.imageshack.us/img401/8867/collapsedze4.png

no collapsed http://img71.imageshack.us/img71/879/nocollapsedkx7.png

as you can see in the first image, the links in the NAV div are floated left and that black border ontop is the actual div called NAV.

in this image you can see how it has top and bottom border and it not collapsed.

here is some of the html and css I used.

alt text http://img301.imageshack.us/img301/5514/codejc8.png

#nav #ulListNavi  a  {
    float: left;
}

解决方案

Add any overflow value other than visible to your container:

div#nav { overflow:auto; }

Then add width to restore the width

div#nav { width: 100%; overflow:auto; }

这篇关于div在浮动css后折叠的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆