回答編集履歴
1
追記
answer
CHANGED
@@ -4,4 +4,28 @@
|
|
4
4
|
`#mainNav`にhideやshowのclassを付けるような形になっていますが、提示のcodepenでいえば`#header`に対して行うはずの部分です。
|
5
5
|
もう一度見直されるか、一度codepenのコードをそのまま貼り付け、fontawesomeの読み込みとjQueryの読み込みをしたものが希望の動作になるのを確認してからidやclassを置換するのがいいと思います。
|
6
6
|
|
7
|
-
※時間があれば、質問に提示のコードを元に訂正したコードを回答に追記します。
|
7
|
+
※時間があれば、質問に提示のコードを元に訂正したコードを回答に追記します。
|
8
|
+
|
9
|
+
---
|
10
|
+
追記
|
11
|
+
|
12
|
+
.mainBox-navの背景の下に#headerが潜り込んでいるのかもしれませんね。
|
13
|
+
```css
|
14
|
+
.mainBox-nav{
|
15
|
+
background-color: #f1f4f5; /* これを消すと表示されるのがわかる */
|
16
|
+
font: 14px/28px 'Open Sans', sans-serif;
|
17
|
+
height: 650px;
|
18
|
+
width: 100%;
|
19
|
+
/* 背景色は付けたままで#headerを表示させたい場合は以下を追記で応急処置できるはず
|
20
|
+
position: relative;
|
21
|
+
z-index: 1;
|
22
|
+
*/
|
23
|
+
}
|
24
|
+
```
|
25
|
+
|
26
|
+
あと、ここの頭の`.`ついてなかったので`font-size`が効いてないです。
|
27
|
+
```css
|
28
|
+
.nav-item i{
|
29
|
+
font-size:30px;
|
30
|
+
}
|
31
|
+
```
|