前提・実現したいこと
レスポンシブサイトの製作を行っています。(勉強のため)
モバイルファースト で作っていまして、
スマホ版ではナビゲーションを画面下に固定して表示しているのですが
PC版ではナビゲーションを上部に固定表示したいと思っていますが、
うまく実装できません。
発生している問題・エラーメッセージ
#nav{
width:98%;
left:0;
bottom:0;
background-color:fff;
position:fixed;
z-index:10;
}
上記の方法でスマホ版では下部に固定表示させています(一部省略してます)
PC版の方は画面上部に固定したいので、position:fixed;でtop:0;にすれば
いいかと思いましたが、スマホの方でbottom:0;(下部固定)しているため(?)
表示が崩れてしまいます。(background-colorが画面いっぱいに広がってしまう)
初心者ゆえ掲示してある情報にも不足があるかもしれませんが、ぜひお力をお借りしたく思っております。
何卒よろしくお願いします。
該当のソースコード
ソースコード
試したこと
ネットで調べて
position:static;でリセットしたりしましたが
改めて上部固定でポジションがかけられず困っています。
補足情報(FW/ツールのバージョンなど)
ここにより詳細な情報を記載してください。
回答1件
あなたの回答
tips
プレビュー