[:a]横スクロールバーを消したい!【HTML+CSS】

横スクロールバーが邪魔で消したい!

横スクロールバーがいらない所で出てきたりしますよね。
(特にスマホ)

横にはみ出した時の為にあえて横スクロールバーを出しておく人もいるのですが、操作上不便なので消す方法です。

overflow-xをhiddenにする

CSSは簡単。

[css]
.body{
overflow-x: hidden;
}
[/css]

overflow-xは、横にオーバーしたものをどうするかの指示をします。
(overflow-yは縦にオーバーしたものをどうするか指示します。)

overflow: scroll; /*スクロールバーを出す*/

overflow: hidden; /*隠す(スクロールバーを非表示)*/

overflow: auto; /*自動(スクロールバーが表示される)*/

設定したのにまだ横スクロールバーが出る?!

設定もちゃんとしてるのにまだ横スクロールバーが出る場合は、
html要素に記述してみましょう。

[css]
.html{
overflow-x: hidden;
}
[/css]

 

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

Twitter でakaneをフォローしよう!

noteでも書いてます(*´ω`*)!

follow us in feedly
Feedlyで購読する!

Twitterで交流しよう!
[ [:a]横スクロールバーを消したい!【HTML+CSS】 ]HTML+CSS, 2013/12/20 21:37