1

こんにちは私h3は中央に配置され、とを使用するをbackground-image作成しましたpadding。IE7を除いて、すべてのブラウザで問題なく表示されます（つまり、h3その中のテキストの幅にパディングを加えたものです）。IE7ではh3デフォルトで100％の幅になっているようです。テキストに応じてサイズを変更する必要があるため、静的な幅を設定したくありません。何か案は？ここにサイトがあります：

h3.bannerh3 {
    font-family: "alternate-gothic-no-1-d",sans-serif;
    font-style: normal;
    font-weight: 400;
    color: #fff;
    text-transform: uppercase;
    font-size: 64px;
    height: 78px;
    display: inline-block;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    position: relative;
    text-shadow: 0px 0px 10px #000000;
    filter: dropshadow(color=#000000, offx=0, offy=0);
    background: url('../../../../img/h2top3.png') repeat-x top, url('../../../../img/h2bottom3.png')  repeat-x bottom;
    -pie-background: url('/img/h2top3.png') repeat-x top, url('/img/h2bottom3.png')  repeat-x bottom; /*PIE*/
    behavior: url(js/pie/PIE.htc);
}
4

1 に答える 1

4

inline-blockIE7では使用できません。代わりに次を試してください。

display: inline-block;
zoom: 1;
*display: inline;

2番目のdisplayプロパティはIE7によって解釈され、要素をに設定しinlineます。残念ながら、これにより、IE7で希望するスタイルを正確に使用できなくなり、同一inlineではなくなります。inline-block

さらにスタイリングが必要な場合は、条件付きコメントの方が適切な場合があります。

<!--[if lte IE 7]>
    <style type="text/css">
        h3.bannerh3 {
          display: inline;
          /* Additional styles here */
        }
    </style>
<![endif]-->
于 2012-06-13T14:40:12.683 に答える