IE7溢出和IE7背景图片

www.myvintagesecret.com

1）我有一个div称为.postheader持有的标题和另一个DIV叫.clip。正如你所看到的，剪辑应该悬停在内容上，而不是将其压下。（使用任何其他浏览器进行测试）。它目前给我一个巨大的差距，当它应该只有文本一样长。

.postheader { 
    background:url(images/posthead.png) no-repeat; 
    min-height:100px; 
    max-height:600px; 
    padding-right:25px; 
    overflow:visible; 
} 

.clip { 
    width:214px; 
    height:275px; 
    float:right; 
    position:relative; 

}

任何想法？我可以使最大高度更小，但会导致.clip div被切断。

2）在侧边栏中，有一些项目称为.sidebaritem。他们有一个只在IE7中没有显示的背景图片。我无法弄清楚这一点。

.sidebar-item 
{ 
    background:url(images/sidebar.png)top center no-repeat; 
    font-size: 12px; 
    margin-bottom: 20px; 
    padding-left: 18px; 
    padding-right:10px; 
    padding-top:8px; 
    min-height:200px; 

}

来源

2009-10-05 user184106

1）试试这个。我认为使用position：绝对而不是float：right会解决问题。

.postheader { 
    background:url(images/posthead.png) no-repeat; 
    position:relative; 
} 

.clip { 
    width:214px; 
    height:275px; 
    position:absolute; 
    top:0; 
    right:25px; 
}

2）嗯..它可能是关闭后的空间）。

background:url(images/sidebar.png) top center no-repeat;

3）回复评论：在这种情况下...您应该重做背景。创建仅包含背景的包装并将您的内容放入其中。剪辑应该是内部包装的顶部div，并且向右浮动。做这样的事情......

<div class="itemTopBg"><div class="itemBottomBg"><div class="itemLeftBg"><div class="itemRightBg"> 
    <div class="clip">...</div> 
    ... content with no bg... just text... 
</div></div></div></div>

来源

2009-10-05 19:15:15

谢谢，这有效，但它重叠我的文本。由于div没有显示每一篇文章，我不能使文本具有一定的宽度。任何想法？ – user184106 2009-10-05 19:18:21

哦，和2）的空间工作！谢谢 – user184106 2009-10-05 19:22:07

感谢Brian。我用你的第一个建议快速入侵。一旦我休息，会编写你的建议:) – user184106 2009-10-05 20:24:37

我想我解决1）这些变化

.clip浮动权，改变位置下降到绝对的，并给它的0

的权利。 postheader增加大约400像素

位置相对

.postheader H2宽度似乎IE7和Firefox，它在其他浏览器不知道如何看，虽然工作。

来源

2009-10-05 19:21:01 Bela

剪辑不是每个项目都有。在h2上设置宽度不是一个好主意。没有理由为没有剪辑的项目设置更窄的宽度。如果h2是短片覆盖下面的文字。我建议重做带有背景的div，正如我在答案中所解释的那样。 – 2009-10-05 19:36:27

IE7溢出和IE7背景图片

回答

相关问题