グリッド内の列を使用してフレックスを水平方向にラップするにはどうすればよいですか?
P粉481035232
2023-08-16 21:11:09
<p>https://codepen.io/itaied246/pen/eYbOWjm</p>
<p>スペースを水平に埋めて下にスクロールする垂直スクロールを備えたフレックスボックスを作成することに成功しました。 </p>
<p>同じことを水平方向にも実行したいと考えています。つまり、垂直方向にスペースを埋めて右にスクロールします。 </p>
<p>私の <code>flex</code> div は、<code>max-content</code> を持つ対応する <code>grid</code> 内にあります。 </p><p>
私は何を取りこぼしたか？ </p>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
フレックスボックスの高さを設定する必要があります。この場合、
height: 400pxを .flex-columns クラスに追加するだけで問題は解決します。その理由は、フレックスボックスが可能な限り高さを想定しており、フレックスの方向が列に設定されているため、すべてが 1 つの列に配置されるためです。フレックスボックスを行にすると視覚的にわかりやすくなります。