2009-07-29 4 views
8

余分なコンテンツがある場合、あなたが私のウェブサイト上のページに移動、スクロールバーが右側に表示されますが、それは私のコンテンツの左にnotiableシフトを有します。あなたは、私は私のページに、ブラウザのスクロールバーを占めることができますどのようにブラウザのスクロールバーのシフト

(www.ipalaces.org)家庭クリックし、自分のサイトに再び戻っホスティングとすることで、これを気づきますか? スクロールバーが常に最低限表示されるようにすることはできますか?私のウェブサイトは www.ipalaces.orgある

は、私に知らせてください。

+0

、あなたのサイズがあなたの窓を小さくする必要があるかもしれません。 – waiwai933

+0

IE8でうまく動作します。ここではどんなブラウザを話していますか? – Joey

+0

すべてのブラウザで、私はHDTVで1360 x 768解像度、720Pを使用していますので、解像度が高くなります。フルサイズのコンテンツを見ることができます。http://www.ipalaces.org/hosting/ domains.htmlをクリックし、自宅をクリックして違いを確認します。 – ParoX

答えて

3

あなたの体は101%背の高い作り...これが常に表示されるまでスクロールバーを強制します。

body {height:101%} 
+0

それはうまくいくが、厄介な1ピクセルの下向きシフトがある。すべてのブラウザにスクロールバーを表示させる方法はありませんが、必要がない場合は無効にする方法はありますか? -moz-scrollbars-verticalと似ています。より普遍的な – ParoX

+0

html、body {height:100%; margin-bottom:1px;} ギャップを小さくしたようですが、まだ隙間があります。 – ParoX

11

まあ、それはブラウザに依存します。

body { 

overflow-y: scroll; 
overflow-x: scroll; 
overflow: -moz-scrollbars-vertical; 

} 

overflow-y)が表示される水平方向(overflow-x)および垂直スクロールバーを強制的。 Operaは、<body>(divsなど)内の要素でない限り、宣言を尊重しないことがあることを思い出していますが、


wsanvilleさん@、およびBHareのコメント@に関してを編集。

+0

これは必要なときに醜いダブルスクロールバーを残します。 – ParoX

+0

'ダブルスクロールバー'を定義します。各軸に2つのスクロールバーがありますか? –

+1

オーバーフロープロパティを 'html'と' body'の両方に適用してはいけません。さもなければ、2つのスクロールバーがあります。ヤク! – wsanville

1

これを試してみてください...私はその醜いを知っているが、それは唯一の方法かもしれません。

#force_scroll { 
    width: 1em; 
    position: absolute; 
    top: 0; 
    bottom: -0.1px; 
    z-index: -1; 
} 

そして、あなたのHTML内のどこか(好ましくは右のあなたの</body>前):

<div id="force_scroll"></div> 
+0

私の前に? これも機能しません。 – ParoX

+0

-0.1pxは有効な測定値ではありません。たとえ-1pxまたは-0.1emを使用してもmargin-bottom:1pxと同じ効果が残ります。 ページは1ピクセル下にスクロールできます。 – ParoX

+0

@Brian、編集を参照してください。もともと ''はコードとしてエスケープ/マークされていませんでした。それはページに表示されませんでした。私はそれがおそらく有用であるには遅すぎることに気づいている。 –

1
body { 
    overflow: scroll; 
} 

私も、最新のFirefox(3.5)と同じ問題を抱えていました。 オーバーフロー機能は私の人生を救った!

7

私はIE6、IE7、IE8、Firefox 3の、とChromeでこれをテストしてみた、と垂直スクロールバーを常に表示していするための簡単な方法は、単純である:

html { overflow-y: scroll; } 
+0

これはあまり賞賛されていない答えが少なく見えます。 http://css-tricks.com/eliminate-jumps-in-horizo​​ntal-centering-by-forcing-a-scroll-bar/ –

1

これは、のために偉大な動作しているようです再現しようとする人のために私...

html { 
    overflow-y: scroll; 
} 
関連する問題