Question

所以我有一个标签菜单，

那就是。

单击选项卡后，该选项卡的内容将显示与选项卡匹配的白色背景。 IE7中的问题是选项卡的内容确实显示但内容超出了我的选项卡div并进入后台。这只发生在IE7中。

内容标记如下

<div class="tabContentRow">
    <div class="tabContentImageLeft" style="DISPLAY: inline">
      <a href="" target="_blank">
        <img width="110" height="110" alt="Video" src="~/?w=110&amp;h=110&amp;as=1" /> </a>
    </div>
    <div class="tabContentCopyRight" style="DISPLAY: inline">
      <h2>video</h2>
      <p>Text here.</p>
    </div>
</div>

问题与我的两个div有关

<div class="tabContentImageLeft" style="DISPLAY: inline">
<div class="tabContentCopyRight" style="DISPLAY: inline">

如果我不把这些内容放在这两个div中，那么即使是IE7，它也能很好地保留在我的tab div中。但是，如果我把它放在标签div没有下降，它只是融入背景。

.tabContentImageLeft {float: left; width: 130px; text-align: center;}
.tabContentCopyRight {float: left; width: 575px;}

Answer 1

在tabContentRow底部添加一个明确的div。您的元素是浮动的，因此从DOM流中取出。

    <div class="tabContentRow">

           .....Inner tab markup


       <div class="clear-fix" style="clear:both;display:block;"></div>
   </div>

CSS IE7问题div不包含内容

1 个答案: