teratail
回答率
85.48%
質問するログイン新規登録
トップに関する質問cssのflexを利用して横配列と縦配列を再現したい

編集履歴

質問編集履歴

3

追記

2017/07/14 07:15

投稿

2001Y
2001Y

スコア83

test CHANGED
File without changes
test CHANGED
@@ -58,21 +58,21 @@
58
58
 
59
59
  <div id="main-content">
60
60
 
61
- </did>
61
+ </div>
62
62
 
63
63
  <div id="Sidebar">
64
64
 
65
65
  <div class="AD">
66
66
 
67
- </did>
67
+ </div>
68
68
 
69
69
  <div class="side-contents">
70
70
 
71
- </did>
71
+ </div>
72
72
 
73
73
  <div class="AD">
74
74
 
75
- </did>
75
+ </div>
76
76
 
77
77
  </main>
78
78
 

2

追記

2017/07/14 07:15

投稿

2001Y
2001Y

スコア83

test CHANGED
File without changes
test CHANGED
@@ -12,7 +12,7 @@
12
12
 
13
13
  </did>
14
14
 
15
- <div id="AD">
15
+ <div class="AD">
16
16
 
17
17
  </did>
18
18
 
@@ -43,3 +43,47 @@
43
43
 
44
44
 
45
45
  サイドバーにはめるべきADとside-contentをdivでくくってしまえば良いのですが、できればくくらないでいければなと思うのですが。
46
+
47
+
48
+
49
+ ##追記
50
+
51
+ 現在、divで囲ってやっているので、divで囲った状態で、 main-content と AD + side-content の高さを揃える方法を教えてください。
52
+
53
+ さらにADの数を増やせるようにしたいです。（高さの変化に対応する）
54
+
55
+ ```HTML
56
+
57
+ <main>
58
+
59
+ <div id="main-content">
60
+
61
+ </did>
62
+
63
+ <div id="Sidebar">
64
+
65
+ <div class="AD">
66
+
67
+ </did>
68
+
69
+ <div class="side-contents">
70
+
71
+ </did>
72
+
73
+ <div class="AD">
74
+
75
+ </did>
76
+
77
+ </main>
78
+
79
+ ```
80
+
81
+ ```CSS
82
+
83
+ main {
84
+
85
+ display: flex;
86
+
87
+ }
88
+
89
+ ```

1

追記

2017/07/14 02:43

投稿

2001Y
2001Y

スコア83

test CHANGED
File without changes
test CHANGED
@@ -39,3 +39,7 @@
39
39
  [ReactNativeのFlexboxレイアウト](http://minotaur.badwitch.io/reactnative-flexbox/) の記事を読んで、align-itemsを使うべきなのかと思いましたが、align-itemsではないようです。。。
40
40
 
41
41
  教えていただけないでしょうか。。。
42
+
43
+
44
+
45
+ サイドバーにはめるべきADとside-contentをdivでくくってしまえば良いのですが、できればくくらないでいければなと思うのですが。