質問編集履歴

1

実現したいレイアウトとコードを追記しました。

2020/04/19 14:43

投稿

mrk
mrk

スコア8

test CHANGED
File without changes
test CHANGED
@@ -1,7 +1,55 @@
1
+ <実現したいレイアウト>
2
+
1
3
  ただのテキストにスペースを持って配置したいです。
4
+
5
+ 以下のheader-logoをヘッダーの左に見やすい間隔をとって配置したいです。
6
+
7
+ <疑問点>
8
+
9
+ 見た目はpaddingもmarginも変わらないが、どのように使い分けるのか、
10
+
11
+ またどのように使い分けているでしょうか。
12
+
13
+ <コード>
14
+
15
+ ```html
16
+
17
+ <header>
18
+
19
+ <div class="header-logo">Progate</div>
20
+
21
+ <div class="header-list">
22
+
23
+ </div>
24
+
25
+ </header>
2
26
 
3
27
 
4
28
 
5
- Float:left;した要素にはpadding,marginどちらでスペースを調整した方が良いのか?
29
+ ```CSS
6
30
 
31
+ .header {
32
+
33
+ background-color: #26d0c9;
34
+
35
+ color: #fff;
36
+
37
+ height: 90px;
38
+
39
+ }
40
+
41
+
42
+
43
+ .header-logo {
44
+
45
+ float: left;
46
+
47
+ font-size: 36px;
48
+
49
+ /*以下の箇所です。*/
50
+
7
- どのように使い分けているでしょうか。
51
+ padding: 20px 40px;
52
+
53
+
54
+
55
+ }