div+css外部的div不会随着内部的div而变长

Posted 2023-05-10

<div class="content">
<div class="mainnav">
<ul>
<li><a href="#">HOME</a></li>
<li><a href="#">ABOUT ME</a></li>
<li><a href="#">CONTACT</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
* margin:0; padding:0;
body
position:relative;
text-align:center;
margin:0 auto;

a
color:#666666;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:12px;
text-decoration:none;

a:hover
color:#990033;
text-decoration:none;

.content
width:1000px;
height:auto;
text-align:center;
border:#000000 1px solid;

.mainnav
width:1000px;
height:50px;
margin-left:0 20 0 20;
position:absolute;
top:20px;
left:50%;
border-bottom:#666666 1px solid;

.mainnav ul
list-style:none;

.mainnav li
float:left;
line-height:70px;
display:block;
margin:0 20px 0 20px;

.clear
clear:both;
height:100px;

content 如何随着 mainnav 增加而增加

楼主，3楼和5楼都不自信，但他们是对的，你清除浮动的方法是错误的，你浮动的是li，你到ul外面去清除浮动有啥用？根本没清掉。

把你的相对、绝对定位去掉，用外边距来定位mainnav的位置，然后给你的mainnav加个：overflow:hidden;来达到正确清除浮动的目的。

另外如果不是有设计上的特别需要的话，最好把你的：
<div class="mainnav"><ul>...</ul></div>
改成：
<ul class="mainnav">...</ul>
外面多套个div，此举多余。

另外，我没试，貌似：height:auto;这句也要删掉，你自己试。 参考技术A 这个好像不好弄吧。div的大小设置好了就不变了。
里面的div溢出了应该会根据overflow属性的设置选择是hidden scroll

你说的那个估计js能解决。
你这个是导航菜单吧
推荐个网址：www.lanrentuku.com这里面有很多漂亮的导航菜单js代码 参考技术B 用到了position，感觉。。。
不如你画个效果，大家帮你写个给你参考下吧！ 参考技术C 不明确
清除浮动试试本回答被提问者采纳 参考技术D .mainnav
width:1000px;
height:50px;
margin-left:0 20 0 20;

margin-top:20px;
margin-left:50%;
border-bottom:#666666 1px solid;

.clear
clear:both;

这两行改一下吧，不改你的代码，目前我还无法实现这个效果

css div 固定一个div 使这个div不随着网页的滚而滚动 就是把这个div固定在一个位置任何时候都在一个位置

参考技术A 给div加个position:fixed;top:0px;
left:0px;可让该div固定在网页的顶部左侧，且不会随网页而滚动。如若想固定在其他位置，只需要改动top,left,right,bottom属性值即可。