この水平スクロールバーを取り除く方法

私の人生にとっては、this siteの下部にある水平スクロールバーを取り除いているようです。私はすべてを（私の能力で）試してみて、誰かが私のためにそれに光を当てることができるかどうか疑問に思っていました。この水平スクロールバーを取り除く方法

ありがとうございます。

出典

2017-03-12 Mitch Gillespie

非常に基本的な答えとして、 'body'タグに' overflow-x：hidden'を設定するだけです。私はあなたの要素の幅が常にウィンドウよりも大きい理由を調べることをお勧めしますが... –

ありがとう、ありがとうございます。私は、何がそれを壊すかを理解しようとしている日のほとんどを試して、私は問題を見つけることができません。 –

編集：それは動作しますが、誰かが問題を見つけることができるかどうかを確認します。再度、感謝します。 –

.row.vc_custom_1488973579542（大きなタイトルのもの）は、.containerの直接の子ではなく、<section>です。

テーマは、.containerに左右のパディングを使用し、対応する左右の負のマージンを.rowに設定したブートストラップの列に基づいたグリッドレイアウトシステムを使用しています。全幅モードでは、.rowを.containerの内側に配置しないと、25pxの行が<body>より大きくなり、水平スクロールバーが作成されます。

可能な修正：

場所この.rowそのため.container（推奨）
オーバーライドデフォルトの行の余白の内側：

.row.vc_custom_1488973579542 { 
    margin-left:0; 
    margin-right:0; 
}

は（推奨されません）オーバーフローを隠します：

body { 
    overflow-x: hidden; 
}

出典

2017-03-12 04:04:30

ありがとうございました。どちらもうまくいったが、推奨されたと一緒に行った再度、感謝します。 –

あなたは2つのオプションがあります。

は、単純にすべての間隔上無視：

<style> 

body { 
    overflow-x:hidden; 
} 

</style>

それともあなたのCSSのすべてを通過し、あなたが誤っていずれかを持っていないことを確認してくださいでした「出血」ボーダーまたは余白/パディング。

要素の幅を20％に設定し、これらの要素のうち5つが存在する場合にブリードが発生しますが、10pxの余白を追加してその一部を切り落とします。

JSFiddle例：

https://jsfiddle.net/nfnneil/9dcdurnj/4/

あなたは4番目の要素が第二のライン上にあることがわかりますか？スタイリングされたオブジェクトの外側でマージンが発生するからです。

注：出血を引き起こす他の多くの方法があります。同様に、境界線などが適切に調整されていない。

私は個人的にoverflow-x：hiddenと一緒に行きますが、それは私が怠け者だからです。しかし、怠惰な方法でoverflow-x：hiddenを使うことで、コードの将来の使用に影響を与える可能性があります。それが言われている、私はあなたが私たちだけオーバーフローする必要があると思う - x：隠された。

出典

2017-03-12 03:58:51 Neil

この水平スクロールバーを取り除く方法

答えて

関連する問題