2

不明な幅 (動的幅) の div がいくつかあります。これらの div をブラウザの幅に合わせて自動サイズ変更するにはどうすればよいですか?

たとえば、幅が異なる5 divがあります。ブラウザーの幅が 3 つの div しか埋められない場合、それらの 3 つの div はブラウザーの幅に合わせて自動的にサイズ変更され、残りは 2 行目に表示されます。

html5 と css3 を使用してどのように作成できますか。css3 に新しい機能の flexbox があることは知っていますが、それを処理できるかどうかはわかりません。

4

1 に答える 1

2

あなたの要求に応じて、calss - 値で遊ぶことができます。最小/最大幅/高さ

例のデモを参照してください jsFiddle

    .grid {
  display: box;
  display: -webkit-flex;
  display: flex;
}
.column {
  padding: 20px;
}
.fluid {
  box-flex: 1;
  background: #ccc;
}
.fixed {
    width: 100px;
  background: red;
}​
于 2012-10-15T06:51:44.733 に答える