回答編集履歴
1
修正コメントを受けて修正
answer
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
最終的な理想のレイアウトがよく分からないが、
|
|
2
|
-
とりあえず、アイコンは左寄せ、ページタイトルとハンバーガーマークは右寄せに配置と仮定して、下記のCSSでどうですか。
|
|
2
|
+
~~とりあえず、アイコンは左寄せ、ページタイトルとハンバーガーマークは右寄せに配置と仮定して~~、「アイコンは左端、タイトルは真ん中、ハンバーガーマークは右端」ということなら下記のCSSでどうですか。
|
|
3
3
|
|
|
4
4
|
```css
|
|
5
5
|
.top-page-header {
|
|
@@ -20,7 +20,6 @@
|
|
|
20
20
|
.photoroke-icon{
|
|
21
21
|
/* width: 100%; 削除 */
|
|
22
22
|
margin-left: 5vw;
|
|
23
|
-
margin-right: auto; /* 追加 */
|
|
24
23
|
height: 100%;
|
|
25
24
|
}
|
|
26
25
|
|
|
@@ -43,4 +42,5 @@
|
|
|
43
42
|
}
|
|
44
43
|
```
|
|
45
44
|
|
|
46
|
-
|
|
45
|
+
アイコン(.photoroke-icon)に width: 100%; を設定しているので他の要素が右に押し出されていますので、これは削除。
|
|
46
|
+
また、高さが指定してないので、画像オリジナルのサイズに表示されるのではみ出ます。高さをヘッダーの高さにしたいなら、height: 100%; を追加。
|