私は大きな問題を抱えていますが、それは "実行可能"ではないかもしれないと思いますが、尋ねるのに害はないと思いました。HTML + CSSのみ - 同じ高さの3つの等しい列（33％〜）
高さが等しい3つの等しい列が必要ですが、高さは分かりませんので、これは動的でなければなりません。
さらに困難にするために、これらの列の背景色はそれぞれ異なります。
コンテンツは垂直方向に整列されるのが理想的ですが、これは必須ではありません。多分フレキシボックスで、このような
Sydenの答えは近いですが、（それを破るだろうほとんど何のマージンやパディングを変更）保守性に問題があります。
ここでは、これらの問題に対処し、任意の数の列に対して機能する代替方法を示します。
.container {
display: flex;
flex-flow: row wrap;
}
.item {
flex: 1;
/* These can be changed or removed without affecting the layout/scrollbars */
padding: 5px;
margin: 0;
}
.item-blue { background: blue; }
.item-green { background: green; }
.item-red { background: red; }<div class="container">
<div class="item item-blue">
Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text
</div>
<div class="item item-green">
Text Text
</div>
<div class="item item-red">
Text Text Text Text Text Text
</div>
</div>何か：
html,
body {
height: 100%;
width: 100%;
}
.container {
display: flex;
flex-direction: row;
justify-content: center;
height: 100%;
width: 100%;
}
.column {
width: 33%;
height: 100%;
background: lightgray;
/*margin: 5px;*/
}<div class="container">
<div class="column"></div>
<div class="column"></div>
<div class="column"></div>
</div>これは私が探していたものです！ div間の間隔を取り除く方法を教えてください。 – user1970395
ビューポートのサイズを変更しましたが、スケールがよくなります（列は等しい幅と高さを思い起こさせ、折りたたみは発生しません）、どのブラウザを使用しましたか？私はクロムとチェックした。 – user1970395
これは、CSSのテーブルを使用して非常に簡単です。それは常に行の中に保持され、コンテンツを垂直方向に整列させることができるので、決して壊れません。
.cols {
display: table;
width: 100%;
}
.cols > div {
display: table-cell;
width: 33%;
vertical-align: middle;
}
.cols > div:nth-child(1) { background: blue; }
.cols > div:nth-child(2) { background: red; }
.cols > div:nth-child(3) { background: green; }<div class='cols'>
<div>
Test testTest testTest testTest test
</div>
<div>
Test<br />Test<br />Test<br />Test<br />Test<br />Test<br />Test<br />Test
</div>
<div>
Test
</div>
</div>
どのように動的にするつもりですか？コンテンツはjavascriptで追加されるつもりですか？その場合、要素の高さを最も高くし、すべての要素の最小高さをその高さに設定する必要があります。 そうしないと、フレックスボックスソリューションを探すことができます。もっと具体的にしてください。 – mnemosdev
あなたはこれをフレックスで簡単に行うことができるはずです。それ以外の場合はjavascriptが必要です。 – Alex
@mnemosdev dynamicはまだ内容がわからないので、コンテナの高さはわかりません。ロードされたコンテンツは変更されません。 – user1970395