溢出：隱藏的問題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文本的頁面，則不會顯示。 向塊類（包裝器類）添加了position：relative attr，但是沒有任何變化（ IE6 + IE7 CSS問題，溢出：隱藏；-位置：相對；組合 ）如何解決該問題？ http://jsfiddle.net/L5Y57/

Answer 1

正如我在評論中所說。

您必須添加position: relative; 使用overflow: hidden類的屬性overflow: hidden 。

還有另一個問題，因為width: auto; 在類.block .element2 ，它也解決了IE7的已知錯誤，以將其更改為width: 100%; 或任何固定寬度。

您可以在代碼中檢查我的修復程序： http : //jsfiddle.net/L5Y57/2/