0

私<a>のページには 2 つの異なるコンテキストの要素があります。一部は div にあり (.container > a と呼びます)、一部は子 div にあり (.container > .section > a のように)、さらにはさらに子孫の div にあるものもあります (のように) .container > ... > .section > a)。<a>現在、次の CSS を使用してインライン要素の書式設定を行っています。

line-height:1.4;
position: relative;
left: 15px;
margin-left: -5px;

現在、リンクを でスタイリングしてborder-bottom: 1px dotted #333いるため、リンクはインライン要素のままにする必要があります。問題は、.section 内のリンクが .container 内のものとは異なる動作をすることがあるということです。後者は、FF 3.6 と IE7 の両方で問題なく表示されます。前者は、最初の文字かそこら (負のマージンの量の内側にあるものは何でも) IE7 で切り取られています (負のマージンで想定しています)。

hasLayoutのバグかもしれないと思ったので、3件の状況を確認してみました。それらは次のとおりです。

ケース 1) .container > a の場合、.container hasLayout は true です。( http://imgur.com/WJ3zM.png )
ケース 2) .container > .section > a の場合、.section hasLayout は false で、.container hasLayout は true です。( http://imgur.com/4NHxj.png )
ケース 3) .container > ... > .section > a の場合、.section hasLayout は false で、介在するコンテナー (div、li、および ul) の 1 つを除くすべてhasLayout が true で、.container hasLayout が true です。( http://imgur.com/WefBk.png )

最初の 2 つのケースは IE7 では問題ないように見えますが、3 番目のケースには負のマージンのバグがあります。このような限られた状況で、何がこれを引き起こしているのでしょうか?

4

2 に答える 2

1

明示的に設定してz-index兄弟をオーバーライドするか、相対的に配置された要素の親要素に位置を設定する必要がある場合があります。IE は、すべての要素に 0 の z-index を誤って適用します。また、overflow:hidden の可能性もあります。

画像は実際の例ほど優れていません。

于 2010-07-16T15:13:44.987 に答える
0

の可能性がありhasLayoutます。ケース 3 のレイアウトを に追加してみました.containerか? （申し訳ありませんが、すでにレイアウトがあるとおっしゃっていましたが、その中の 1 つを意味していました.section...）

以下のコメントと実験に基づいて追加しました。

タグのmargin-left: -5pxをに変更text-indent: -5pxします。a

于 2010-07-16T15:15:03.347 に答える