90605


<https://y-sasakik.github.io/web/web3/>

上のサイトでスマホ時に横幅いっぱいにならず、困っています。

どこを変えれば直りますか？  
ソースは検証ツールまたは GitHub のリポジトリを参照してください。

<https://github.com/y-sasakik/web/tree/main/web3>

(追記)  
スマホ時にコンテンツ幅を画面いっぱいにしたいということです。例えば「スクールの概要」あたりはスマホ時に横スクロールできてしまい、切れたようになってしまいます。これをコンテンツ幅を画面サイズにぴったり合うようにしたいといいますか、横スクロールしないようにしたいです。  
説明下手ですいません。よろしくお願いします。


CC BY-SA 4.0
2022-08-15T08:06:39.623
90566
2022-08-18T03:08:04.127
2022-08-18T03:08:04.127
3060
43400
question
html css
スマホ時に 横幅いっぱいにならず、困っています。


`.student
dd`要素に対するcssで`width:100%`と`padding:20px`が指定されているので、パディングの分だけ画面サイズからはみ出してしまっているのが原因かと思います。

`.student dd`に対して`box-sizing: border-
box;`を指定してみてください。これによって、widthで指定した数値の内側にパディングが設定されるようになります。


CC BY-SA 4.0
2022-08-18T02:48:41.000
90605
2022-08-18T02:48:41.000
52932
90566
answer