teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

2

2020/05/09 09:27

投稿

niccha
niccha

スコア22

title CHANGED
File without changes
body CHANGED
@@ -33,4 +33,6 @@
33
33
  height: 400px;
34
34
  width: 50%;
35
35
  }
36
- ```
36
+ ```
37
+
38
+ 上記コードの場合、2列になりますが、container、boxの両方のheightをautoにした場合、2つめのboxで列換えをさせる方法がありますでしょうか??

1

コードを加筆いたしました。

2020/05/09 09:27

投稿

niccha
niccha

スコア22

title CHANGED
File without changes
body CHANGED
@@ -4,4 +4,33 @@
4
4
  今は、親要素へ高さ指定し、調整して、2列目の最初のボックスを調整しているのですが。
5
5
  高さ指定での折返しだと、高さが変動してしまう仕様なので、都度都度高さ指定見直ししないといけないもので。
6
6
 
7
- ご教示お願いいたします。
7
+ ご教示お願いいたします。
8
+
9
+ コードは、
10
+ ```HTML
11
+ <div class="container">
12
+ <div class="box">
13
+ 内容
14
+ </div>
15
+ <div class="box">
16
+ 内容
17
+ </div>
18
+ <div class="box">
19
+ 内容
20
+ </div>
21
+ <div class="box">
22
+ 内容
23
+ </div>
24
+ </div>
25
+ ```
26
+
27
+ ```CSS
28
+ .container {
29
+ height: 900px;
30
+ flex-flow: column wrap;
31
+ }
32
+ .box {
33
+ height: 400px;
34
+ width: 50%;
35
+ }
36
+ ```