我上下搜索过这个问题，这似乎很常见，但我还没有找到解决我的具体问题的办法。
我的网页在 Firefox 和 Chrome 中以及在 Windows 8 上的 IE10 中显示完美无缺。但是，任何其他 IE 版本都会让我的 DIV 全部困惑。
网站:http://d2canton.pitmanstats.com
正确的布局:Google 广告位于导航栏下方，并与白色内容部分的左侧对齐，表格(团队列表)位于广告右侧。
在检查元素并比较 IE、Chrome 和 Firefox 之后，这似乎是问题所在，但据我所知，源代码看起来非常好:在我看来，在 Internet Explorer 中， “clearfix”和“main-fullwidth”DIV 从同一点开始(例如，每个 DIV 的顶部与另一个齐平)，与“header”div 的底部齐平。
但是，“main-fullwidth”DIV 应该在“clearfix”DIV 之后/下方开始。
我似乎无法理解为什么会这样。
这是 index.php 中的相关代码:
<body class="home blog custom-background">
<div id="container">
<?php include('includes/header.php'); ?>
<?php include('includes/outer_nav.php'); ?>
<div id="main-fullwidth">
<section style="display:block; overflow: hidden; border: 0px; padding:0px; ">
<aside style="display:block; float: left; width: 180px; ">
<?php include('includes/left_sidebar.php'); ?>
</aside>
<div style="margin-left:180px;">
<?php include('includes/inner_header.php'); ?>
<!-- CONTENT STARTS HERE -->
<!-- CONTENT ENDS HERE -->
</div>
</section>
</div><!-- #main-fullwidth -->
这是 outer_nav.php(包含“clearfix”):
<div class="clearfix">
<div class="menu-primary-container">
<ul id="menu-custom-primary-menu" class="menus menu-primary">
<li id="menu-item-241" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-241"><a href="http://www.pitmanstats.com" >Home</a></li>
<li id="menu-item-236" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-236"><a href="http://www.pitmanstats.com/pages/" >My Pages</a>
<ul class="sub-menu">
<li id="menu-item-242" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-242"><a>DII Canton District</a></li>
<li id="menu-item-243" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-243"><a>DIII Wooster District</a></li>
<li id="menu-item-245" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-245"><a>Triway Basketball</a></li>
<li id="menu-item-244" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-244"><a>Quarter’s Corner</a></li>
</ul>
</li>
<li id="menu-item-441" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-441"><a href="http://www.pitmanstats.com/mobile/" >Mobile Apps</a></li>
<li id="menu-item-240" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-240"><a>About</a>
<ul class="sub-menu">
<li id="menu-item-237" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-237"><a href="http://www.pitmanstats.com/about/about-me/" >About Me</a></li>
<li id="menu-item-238" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-238"><a href="http://www.pitmanstats.com/about/history-of-pitmanstats-com/" >History of PITmanStats.com</a></li>
<li id="menu-item-239" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-239"><a href="http://www.pitmanstats.com/about/contact/" >Contact</a></li>
</ul>
</li>
</ul>
</div><!--.primary menu-->
<div id="topsearch">
<div id="search" title="Type and hit enter">
<form method="get" id="searchform" action="http://www.pitmanstats.com/">
<input type="text" value="Search" name="s" id="s" onblur="if (this.value == '') {this.value = 'Search';}" onfocus="if (this.value == 'Search') {this.value = '';}" />
</form>
</div><!-- #search -->
</div><!-- topsearch -->
</div><!-- clearfix -->
那么所有“left_sidebar.php”都是谷歌广告。
同样，在我看来，这是一个问题，“main-fullwidth”在 Internet Explorer 中“clearfix”之后没有正确启动，而是从相同的位置开始。这会导致广告尝试向左对齐，但它会立即向左对齐到导航菜单的右侧。
如果您有任何问题或需要更多详细信息，请告诉我。这在过去有效，但最近停止工作。谢谢!
最佳答案
问题似乎是由您使用的某些 html5 标记引起的。
aside标签似乎是破坏 IE9- 布局的元素之一。我用一个很好的旧潜水替换它并将它放回 <section> .你只需要做一些IF IE条件 CSS 使其看起来一致。祝你好运。
使用 F12 在 IE 上调试它。
这是一张照片。
关于css - 仅限 Internet Explorer 的 DIV 对齐问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13355044/