2012-04-05 12 views
0

IE7に問題があります。私は次のHTML形式を持っています。IE7に伝言が残っていません

<fieldset class="wrapper"> 
    <legend class="ct">Legend </legend> 
    <div class="ct">Div 1</div> 
    <div class="ct">Div 2</div> 
</fieldset> 

そして、これは、CSSスタイルです

.wrapper .ct { 
    display:inline-block; 
    *display:inline; /*IE7*/ 
    float:left 
} 

私は他のブラウザでこれをテストするとき、それが正常に動作しますが、IE7にはありません。以下のスクリーンショットをご覧ください。しかし、私が代わりに伝説を使用する場合、それは動作します。ここにあるJsfiddle enter image description here

+0

なぜあなたはここに 'legend'要素を使うのでしょうか? 'legend'は' fieldset'の中の要素の記述を提供するために使われ、 'fieldset'の外では使われないようにしてください。私は見出し要素( 'h2'など)がここでもっと適切だと思います。 「伝説」は本当にスタイルを作るのが難しいので、なぜあなたが自分でそれをより困難にするのか混乱しています。 – powerbuoy

+0

これは有効なHTMLではありません。 'legend'要素は' fieldset'のためのものです。 [この要素が使用できるコンテキスト:フィールドセット要素の最初の子として](http://dev.w3.org/html5/spec/single-page.html#the-legend-element) – steveax

+0

私は知っていますどういう意味ですか。実際にフィールドセット内にあり、divが凡例と重ね合わされています。これはCMSの形式の一種であり、変更することはできません。 – Dips

答えて

0

IE7の場合、インライン(インラインブロックではない)を表示するように設定してみてください。

痛みの伝説はどれだけ忘れましたか。おそらく、それを置くために絶対位置を使用する必要があります - 他のものには左マージンを、親には余白を残します。デザインによって異なります。

0

IEはあなたがそうのように、それだけでブラウザを対象とする代わりに、ハックとdisplay:inlineを使用することができ、display:inline-blockを理解していない:

.wrapper .ct { 
    display:inline-block; 
    *display:inline; 
    float:left 
} 
+0

これはうまくいきません。私は代わりにdivを使用する場合にのみ動作します – Dips

+0

@ user1193749 cam http://jsfiddle.netでテストケースを投稿しますか? –

+0

ここでは[link](http://jsfiddle.net/2EZPY/2/) – Dips

1

アンドレスはほとんどそれを持っていました。 "float:left"の後ろに "* float:none"を追加してください。

.wrapper .ct { 
    display:inline-block; 
    float:left; 
    *display:inline; 
    *float:none; 
}​ 

Here's the updated fiddle

関連する問題