回答編集履歴
1
コードの説明を追加
answer
CHANGED
|
@@ -17,4 +17,10 @@
|
|
|
17
17
|
top: 0;
|
|
18
18
|
left: 0;
|
|
19
19
|
}
|
|
20
|
-
```
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
### コードの説明
|
|
23
|
+
`.col-4:before`では、正方形のエリアを作成しています。
|
|
24
|
+
`height: 100%`は、position指定以外では、うまく効かないので、`padding-top: 100%;`で高さを設定します。
|
|
25
|
+
すると、どんな幅になっても正方形になります。
|
|
26
|
+
そのエリアに対して`input`をぴったり配置させるため、`.col-4`を親として`position`指定をしています。
|