質問編集履歴

1

HTMLとCSSを追加しました。

2021/01/21 12:59

投稿

yamada1213
yamada1213

スコア1

test CHANGED
File without changes
test CHANGED
@@ -38,10 +38,112 @@
38
38
 
39
39
  display: inline-block;
40
40
 
41
- float: right;
41
+ float: right;}
42
-
43
-
44
42
 
45
43
 
46
44
 
45
+
46
+
47
+ 返答ありがとうございます。
48
+
49
+ 親要素は<header>です。
50
+
51
+ ホームとページはfloatで並べています。
52
+
53
+ よろしくお願いいたします。
54
+
55
+
56
+
57
+
58
+
59
+ <header>
60
+
61
+ <div class="container">
62
+
63
+ <div class="header-left">
64
+
65
+ <h1><a href="#">Write</a></h1>
66
+
67
+ <p>書くためのテーマ</p>
68
+
69
+ </div>
70
+
71
+
72
+
73
+ <div class="header-right">
74
+
75
+ <div class="header-nav">
76
+
77
+ <ul class="gnav">
78
+
79
+ <li><a href="#">ホーム<span class="fas fa-angle-down"></span></a>
80
+
81
+ <ul>
82
+
83
+ <li><a href="/">→カスタマイズ</a></li>
84
+
85
+ </ul>
86
+
87
+ </li>
88
+
89
+
90
+
91
+ <li><a href="#">ページ<span class="fas fa-angle-down"></span></a>
92
+
93
+ <ul>
94
+
95
+ <li><a href="/">アイキャッチ画像無しのページ</a></li>
96
+
97
+ <li><a href="/">ページ(全幅テンプレート)</a></li>
98
+
99
+ </ul>
100
+
101
+ </li>
102
+
103
+
104
+
105
+ <li><a href="#">タイポグラフティ</a></li>
106
+
107
+ <li><a href="#">お問い合わせ</a></li>
108
+
109
+ </ul>
110
+
111
+
112
+
113
+ <div class="search-wrapper">
114
+
115
+ <form action="">
116
+
117
+ <input class="search" name="q" type="text" placeholder="検索…" />
118
+
119
+ </form>
120
+
121
+ </div>
122
+
123
+ </div>
124
+
125
+ </div>
126
+
127
+ </div>
128
+
129
+ </header>
130
+
131
+
132
+
133
+ .header-left {
134
+
135
+ float: left;
136
+
47
137
  }
138
+
139
+
140
+
141
+
142
+
143
+ .header-right {
144
+
145
+  padding-top: 45px;
146
+
147
+  float: right;
148
+
149
+ }