質問編集履歴
5
補足
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -5,6 +5,8 @@
|
|
|
5
5
|
position：stickyを使ってグローバルメニューをページの左側にフロート状態で固定したいと思っています。
|
|
6
6
|
|
|
7
7
|
ただし、フッター部分にはメニューを重ねたくないため、ページトップからフッターの手前までをsticky containerとして設定すれば実現できるかと考えています。
|
|
8
|
+
|
|
9
|
+
また、position:stickyを指定したメニューは常に画面の手前に表示された状態にしたいと思っています。
|
|
8
10
|
|
|
9
11
|
|
|
10
12
|
|
4
内容の補足
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -15,6 +15,20 @@
|
|
|
15
15
|
position：stickyを指定しているheader部分を常に手前にフロートするためにz-indexを指定しているのですが、要素の重なりが反映されずにheaderとそれ以降のコンテンツが上下に並んで表示されてしまいます。
|
|
16
16
|
|
|
17
17
|
headerをコンテンツの手前に重ねるにはどうしたら良いでしょうか。
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
【実現したいデザイン】（position:fixedで再現しています）
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
【現在のデザイン】
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
|
|
18
32
|
|
|
19
33
|
|
|
20
34
|
|
3
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
|
|
13
13
|
|
|
14
14
|
|
|
15
|
-
position：stickyを指定しているheader部分を常に
|
|
15
|
+
position：stickyを指定しているheader部分を常に手前にフロートするためにz-indexを指定しているのですが、要素の重なりが反映されずにheaderとそれ以降のコンテンツが上下に並んで表示されてしまいます。
|
|
16
16
|
|
|
17
17
|
headerをコンテンツの手前に重ねるにはどうしたら良いでしょうか。
|
|
18
18
|
|
2
説明の補足
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -2,7 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
|
|
5
|
-
position：stickyを使ってグローバルメニューをページの左側に固定したいと思っています。
|
|
5
|
+
position：stickyを使ってグローバルメニューをページの左側にフロート状態で固定したいと思っています。
|
|
6
|
+
|
|
7
|
+
ただし、フッター部分にはメニューを重ねたくないため、ページトップからフッターの手前までをsticky containerとして設定すれば実現できるかと考えています。
|
|
6
8
|
|
|
7
9
|
|
|
8
10
|
|
|
@@ -10,7 +12,7 @@
|
|
|
10
12
|
|
|
11
13
|
|
|
12
14
|
|
|
13
|
-
position：stickyを指定しているheader部分
|
|
15
|
+
position：stickyを指定しているheader部分を常に左端にフロートするためにz-indexを指定しているのですが、要素の重なりが反映されずにheaderとそれ以降のコンテンツが上下に並んで表示されてしまいます。
|
|
14
16
|
|
|
15
17
|
headerをコンテンツの手前に重ねるにはどうしたら良いでしょうか。
|
|
16
18
|
|
1
文法の修正
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -25,10 +25,6 @@
|
|
|
25
25
|
<!DOCTYPE html>
|
|
26
26
|
|
|
27
27
|
<html lang="ja">
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
28
|
|
|
33
29
|
<body>
|
|
34
30
|
|