質問編集履歴
1
解決策の片鱗を見つけたため追記
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -140,4 +140,26 @@
|
|
|
140
140
|
知人も勉強中で詳しくは聞けずです。
|
|
141
141
|
|
|
142
142
|
### 補足
|
|
143
|
-
|
|
143
|
+
良さげな記事を見つけました。
|
|
144
|
+
これに沿って考えてみます。
|
|
145
|
+
|
|
146
|
+
https://teratail.com/questions/335329
|
|
147
|
+
|
|
148
|
+
私がこのレイアウトをフロートで組むときに考えるのは、以下のような感じです。
|
|
149
|
+
|
|
150
|
+
全体にサイズ指定があるので、まず、全体を包む要素を用意する
|
|
151
|
+
縦並びで3つのエリアに分割できるので、要素を3つ用意する
|
|
152
|
+
一番上と一番下はサイズと色を付けて終わり
|
|
153
|
+
真ん中は横並びで2つのエリアに分割できるので、要素を2つ用意して全部フロートする
|
|
154
|
+
内部要素が全てフロートしたので、親要素をclearfixする
|
|
155
|
+
左側はサイズと色を付けて終わり
|
|
156
|
+
右側は縦並びで2つのエリアに分割できるので、要素を2つ用意する
|
|
157
|
+
下側はサイズと色を付けて終わり
|
|
158
|
+
上側はは横並びで2つのエリアに分割できるので、要素を2つ用意して全部フロートする
|
|
159
|
+
内部要素が全てフロートしたので、親要素をclearfixする
|
|
160
|
+
右側はサイズと色を付けて終わり
|
|
161
|
+
左側は縦並びで2つの要素なので、要素を2つ用意する
|
|
162
|
+
サイズと色を付けて全部終わり
|
|
163
|
+
|
|
164
|
+
|
|
165
|
+
|