溢出:隐藏问题Internet Explorer 7

Question

HTML

<div class="block">
    <div class="element1">text text text text </div>
    <div class="element2">text text text text text text text text text text text text text text text text text text text text text text text text text text text text</div>
</div>

CSS

.block{
    background:#F00;
    float: left;
    height: 90px;
    padding: 0 24px 0 0;
    position: relative;
    width: 256px;
}   
.block .element1{
    color: #000;
    display: block; 
    float: left;
    font-size: 32px;
    height: 35px;
    overflow: hidden;
    padding: 25px 0 0;
    text-align: right;
    width: 100%;
}
.block .element2 {
    color: #000;
    display: block;
    float: right;
    font-size: 12px;
    height: 14px;
    line-height: 1.1;
    margin: 15px 0 0;
    max-width: 205px;
    overflow: hidden;
    padding: 0 0 0 15px;
    text-align: right;
    width: auto;
}

溢出:在element2类中隐藏attr =>对于IE8,9,FF,Chrome,Safari,Opera没有任何问题但是如果我打开带有IE7文本的页面则不显示.添加位置:相对attr到块类(包装类)但没有任何变化(IE6 + IE7 CSS问题溢出:隐藏; - 位置:相对;组合)如何解决问题？ http://jsfiddle.net/L5Y57/

Answer 1

正如我在评论中所说.

您必须将position: relative;属性添加到使用的类overflow: hidden.

而你还有另外一个问题,因为width: auto;在课堂上.block .element2,它也是IE7的已知错误,要解决它将其改为width: 100%;或任何固定宽度.

您可以在代码中查看我的修复程序:http://jsfiddle.net/L5Y57/2/