CSS - タイルサイズの自動サイズイメージで覆われたスクロールバーを解決する

Question

このサイトでは、固定ヘッダーの両側に画像をタイルするのに役立つ大きな助けがありました。私が持っている1つの問題は、右のスクロールバーがタイル画像で覆われてアクセス不能になっていることです。私はそれが何かシンプルだと確信していますが、私は瞬時に失っています。ここでは例を見ることができます：http://www.jzandecki.com/example

Answer 1

ヘッダーを最初から再構築する必要があります。まずdivの作成（これはあなたのヘッダコンテナになります）、idに "header"と言う名前を付けてください。あなたのタイルの黒い画像を背景として追加します。そのdivの位置はFIXEDでなく、ABSOLUTEでなければなりません。あなたのヘッダーのdivで

position: fixed; 
background: url("../images/example_top.jpg") repeat scroll 0 0 transparent; 
background-repeat: repeat-x; 
height: 178px; 
width: 100%; 

幅サイズのためにあなたのパワープラントの画像の幅を有する別のDIVを加えます。このdivのCSSをmargin：autoに設定します（画面中央に配置するには）。

margin: auto; 

これは機能するはずです。 これは、以前と同じビューを持つ必要がありますが、スクロールバーはヘッダーの上に表示され、非表示にはなりません。

編集：私はあなたの体は、画面の左側に900 pxとスティックで見ところで

。私はあなたの体のために次の属性を持っていることをお勧めします：

margin: 0; 
padding: 0; 

体はページ全体を占有しなければなりません。 コンテンツに900 pxのラッパーブロックが必要な場合は、ヘッダーdivの後にdivを追加します（上記を参照）。この新しいdivには、次のCSS属性が必要です。

width: 900px; 
margin: auto; //this centers your div in the middle of your screen 
//Other styles that have nothing to do with positioning 

幸いです。