我在我网站的标题中 float 了两个元素,它们是 <div id="twitter">
和 <div id ="navbar>
,但是当我在 IE6 和 IE7 中查看它们时,外观会出现偏差。我认为我要么需要清除 float 元素,要么应用 clearfix,但我不确定在哪里。
这是 IE6 和 IE7 中问题的图片:
这是在现代浏览器中出现的理想结果。
这是网页的链接:http://www.bestcastleintown.co.uk/pg/
CSS:
#twitter {
background: red;
float: right;
height: 40px;
margin-bottom: 40px;
width: 200px;
}
#navbar {
font-size: 2.2em;
float:right;
}
HTML:
<div id="main_header">
<div id="inner_main_header">
<div>
<div id="main_logo">
<div class="home_page_logo left">
<a href="index.php"><img src="PG_awards_logo.gif"></a>
</div>
</div>
<div>
<div id ="twitter" class="padall">
Follow us
</div>
<div id ="navbar" class="right">
<ul class="nav NG">
<li>home</li>
<li>enter</li>
<li>categories</li>
<li>judging</li>
<li>sponsorship</li>
<li>contact</li>
</ul>
</div>
</div>
</div>
</div>
</div>
最佳答案
将 #navbar
样式更改为:
#navbar{
font-size: 2.2em;
float: right;
width: 60%;
overflow: auto;
}
只需给 #navbar
一些宽度和溢出,而不是可见的。
关于css - IE7 和 IE6 中的 float div 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16088384/