質問

幅100%の流体レイアウトのWebページがあります。

ブラウザウィンドウを変更すると、ページの要素が重複します。

このウェブサイトと同様の効果を作成します http://bologna.bakeca.it/ ウィンドウが固定幅よりも小さいときは、サイズ変更を停止します。

役に立ちましたか?

解決

ボディータグにCSSの最小プロパティを設定できます。このプロパティはIE6によってサポートされていないため、次のように書くことができます。

body{
   min-width:1000px;        /* Suppose you want minimum width of 1000px */
   width: auto !important;  /* Firefox will set width as auto */
   width:1000px;            /* As IE6 ignores !important it will set width as 1000px; */
}

または:

body{
   min-width:1000px; // Suppose you want minimum width of 1000px
   _width: expression( document.body.clientWidth > 1000 ? "1000px" : "auto" ); /* sets max-width for IE6 */
}

他のヒント

まあ、あなたはほとんど自分に答えを与えました。 CSSでは、含有要素に最小幅を与えます。 IE6をサポートする必要がある場合は、最小トリックを使用できます。

#container {
    min-width:800px;
    width: auto !important;
    width:800px;
}

これにより、IE6および最新のブラウザで800pxの最小幅が効果的に提供されます。

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top