4

コードは次のとおりです。

<!DOCTYPE html>
<html>
<head>
<style>
    li div {
      border: 1px solid #FF0000; 
      width: 100px; 
      position:relative; 
      white-space: nowrap; 
      overflow: hidden;
    }
</style>
</head>
<body>
    <ol>
        <li>
            <div>111111111111111111111</div>
        </li>
        <li>
            <div>222222222222222222222</div>
        </li>
    </ol>
</body>
</html>

このページは、IE8では期待どおりに表示されません。

Firefox :( OK）

http://i45.tinypic.com/t6fexy.jpg

IE8 :(間違った）

http://i47.tinypic.com/2naslqp.jpg

誰かが理由を説明できますか？

削除すれば<!DOCTYPE html>すべて問題ありませんが、理由を見つけてCSSで修正したいと思います。

4

2 に答える 2

2

インライン要素として表示するようにdivのスタイルを設定することもできます。

li div { 
  display:inline;
}
于 2013-07-11T17:30:09.710 に答える
0

'li'タグを基準にした位置を追加し、'div'タグの絶対値を基準にした位置を変更して' top：0;を追加できます。左：0; 'todivtag.thisは正常に機能します。

このcssを試してください：

li {
  position:relative;
}
li div {
  border: 1px solid #FF0000; 
  width: 100px; 
  white-space: nowrap;
  overflow:hidden;
  position:absolute;
  top:0;
  left:0
}
于 2013-02-20T08:13:36.647 に答える