0

トップヘッダーが100%幅に固定されているサイトがあり、そのDIV内に、中央に980px幅の別のdivがあります。

ブラウザのスクロールバーを作成するaをロードすると(ページが長いため)、ページがロードされ、ヘッダーがロードされますが、スクロールバーに対応するために左にジャンプします。

スタイルシートに追加overflow-y:scroll;してスクロールバーを常に表示できるようにすることはできますが、jquery fancybox v.2を使用しているので、これは良くありません。長いfancyboxポップアップでこれを行うと、2つのスクロールバーが表示されます。失敗。

それで、スクロールバーがあるかのようにヘッダーの中央セクションをロックする方法はありますが、実際にはスクロールバーはありませんか?また、スクロールバーが存在するかどうかに関係なく、同じ位置にあります。

これは私が今使っているCSSです:

#topbar {
width:100%; 
height:51px;
margin:0;   
padding:0;  
position:fixed;
z-index:1000;
/*Making sure it sticks to left of window in IE7*/
top:0;
left:0;
float:left; 
background-color:#eeeeee;
border-bottom:1px solid #333;
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
}

.header { 
width:980px; 
margin:0 auto; 
position: fixed; 
z-index: 1001; 
left: 50%; 
margin-left: -490px; 
}

その呼ばれる例えば<div id="topbar"><div class="header">blah blah</div></div>

解決策はありますか?

4

0 に答える 0