質問: 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/ツールのバージョンなど) ここにより詳細な情報を記載してください。
回答: top:0を追加しても自動的にbottom:0が無効になるわけではないので、 メディアクエリの中で明示的にbottomの値をリセットしないとダメかと思います。 ``` nav { width:98%; left:0; bottom: auto; /*追加*/ top: 0; /*追加*/ background-color:fff; position:fixed; z-index:10; } ``` このように指定すればPC時は上につきませんかね?