回答編集履歴

2

追記

2021/10/22 18:49

投稿

luuguas
luuguas

スコア501

test CHANGED
@@ -23,3 +23,23 @@
23
23
  }
24
24
 
25
25
  ```
26
+
27
+
28
+
29
+ ### 追記
30
+
31
+ "© 2021 Airbnb, Inc."の下の空白は、ページ全体がブラウザの画面内に収まっているために出てくる空白です。`<main>`のheightを350pxほどに設定するか、ページを拡大したりして、ページがブラウザの画面からはみ出る(スクロールできる)ようにすると、この空白は消えます。
32
+
33
+
34
+
35
+ 変更前:
36
+
37
+ ![変更前](446227cf452028f342cce3473935c86f.png)
38
+
39
+ ページを150%に拡大したとき:
40
+
41
+ ![150%に拡大](01276efaae3b0a07ba62684870474946.png)
42
+
43
+ `<main>`のスタイルに`height: 350px`を追加したとき:
44
+
45
+ ![mainの高さを350pxにする](64614d66643ae3ac3faa5e2cf508c925.png)

1

marginの追加

2021/10/22 18:49

投稿

luuguas
luuguas

スコア501

test CHANGED
@@ -1,4 +1,4 @@
1
- .p-footer__rootのpaddingの1番目の値(24px)を変えればよいです。0pxにすれば空白はなくなります。
1
+ .p-footer__rootのmarginの1番目の値(40px)を変えると横線と"Airbnb Plus"の間の空白の高さを、paddingの1番目の値(24px)を変えると横線と"© 2021 Airbnb, Inc."の間の空白の高さを変更きます。0pxにすれば空白はなくなります。
2
2
 
3
3
  ```
4
4
 
@@ -14,9 +14,9 @@
14
14
 
15
15
  border-top:1px solid #000;
16
16
 
17
- margin:40px 0 0;
17
+ margin:40px 0 0; //40px ... 横線と"Airbnb Plus"の間の空白
18
18
 
19
- padding:24px 0 0; //<-修正箇所
19
+ padding:24px 0 0; //24px ... 横線と"© 2021 Airbnb, Inc."の間の空白
20
20
 
21
21
  }
22
22