回答編集履歴
1
解説を追記
answer
CHANGED
|
@@ -6,4 +6,22 @@
|
|
|
6
6
|
.globalHeder {
|
|
7
7
|
justify-content: space-between;
|
|
8
8
|
}
|
|
9
|
-
```
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
または、こうでは？
|
|
12
|
+
|
|
13
|
+
```css
|
|
14
|
+
.Navigation {
|
|
15
|
+
flex-grow: 1;
|
|
16
|
+
}
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
---
|
|
20
|
+
|
|
21
|
+
> 中身のアイテムの間や周囲に間隔を配置する方法を定義します。
|
|
22
|
+
[justify-content - CSS: カスケーディングスタイルシート | MDN](https://developer.mozilla.org/ja/docs/Web/CSS/justify-content)
|
|
23
|
+
|
|
24
|
+
ということなので、.Navigationに「justify-content: flex-end;」を使えば、.Navigationの中身のアイテムを.Navigationの中で末尾に寄せることになります。
|
|
25
|
+
ですので、.Navigationに「justify-content: flex-end;」を使うのであれば、その幅がページ右端まである必要があります。
|
|
26
|
+
|
|
27
|
+
ですので、回答のように、親要素にスタイルをつけて対応するか、.Navigationの幅を広げるか、が解決方法となります。
|