2009-06-13 8 views
0

このページをInternet Explorer用に修正するにはどうすればよいですか?イメージの下のIEスペース?

    ------------------ 
       | TOP IMAGE |<- base_top.png 
       ------------------ 
       | |   | | 
base_sides.png ->| | CONTENT | |<- base_sides.png 
       | |   | | 
       |----------------- 
       | BOTTOM IMAGE |<- base_bottom.png 
       ------------------ 

答えて

6

IEはすべての要素が少なくとも1文字高いはずであるという奇妙な考えがあるからです。

#topスタイルと#bottomスタイルにoverflow:hidden;を追加すると、IEは指定したよりも大きな要素を作成しないようにします。

一般的なヒント:
標準に準拠したモードでレンダリングするようにページに適切なdoctypeを追加すると、IEのページのレンダリング方法が大幅に向上します。

W3C: Recommended list of DTDs

+0

ありがとう、働いた! – JasonV

0

あなたが明示的にあなたのCSSでimg {margin-bottom:0;}を与える必要があります。設計時にはこのようなものです

http://orangeguy.biz/profile/

..何らかの理由で背景画像の下のスペースを追加しているようです。 IEは自動的にイメージの周りにバッファを置きますが、スタイルシートのルールを聴くべきです。

+0

これらは画像ではなく、実際には特定のdivの背景画像です。それをもっと明確にしなければならない、申し訳ありません。 – JasonV

0

私はmargin:0;パディング:0;上の*(all)要素のスタイルシート宣言で。したがって、問題は再び発生しません。もし私が何か他のことを示唆していたら?センターの要素を揃えるには、margin-left:auto; margin-right:auto; W3.orgにより示唆されるように:http://www.w3.org/Style/Examples/007/center

0

IEはデフォルトfont-sizeline-height を持っているので、IEのデフォルトfont-sizeline-heightより少しそのイメージの高さ。

セット:

font-size:0 
line-height:0 
overflow:hidden 
関連する問題