CSS IE7 问题 div 不环绕内容答案

【问题标题】：CSS IE7 Issue div not wrapping around the contentCSS IE7 问题 div 不环绕内容
【发布时间】：2012-04-03 06:43:35
【问题描述】：

所以我有一个标签菜单，

所以即

一旦单击选项卡，该选项卡的内容就会显示为与该选项卡匹配的白色背景。 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，它也会很好地保留在我的选项卡 div 中。但如果我把它放在标签 div 上，它不会下拉，它只会融入背景。

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

【问题讨论】：

标签： css

【解决方案1】：

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

    <div class="tabContentRow">

           .....Inner tab markup


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

【讨论】：