2011-07-18 10 views
0

私はウェブサイトを設計しており、今はちょっと困っています。ウィンドウサイズが小さければ、要素は重なり合っていますか?

あなたがでウェブサイトを閲覧した場合:

http://www.noxinnovations.com/portfolio/charidimos/

あなたは、ウィンドウのサイズを変更する場合は、ナビゲーションロゴ/ヘッダーと重なって気づくでしょう。

とにかくこれを変更しますか?私が実際にやりたいことは、もし可能ならばウィンドウにスクロールバーが現れるようにすることです。

アイデア?

ありがとう:-D。

答えて

3

を行うことができますそれはあなたの奇妙なオーバーフローの問題の原因になっていますあなたの#header要素であなたのwidth: 100%;です。 #logo#navigationの要素を別のdivの中に入れ、その高さと幅を固定した高さと幅を#headerに入れて#headerというプロパティーをoverflow: hidden;としてください。

+0

しかし、これはまだ、ウィンドウの全体にわたって100%繰り返すヘッダの背景イメージを持っていますか? –

+1

ええと...あなたは '#header'ssssの残りの部分をほぼ同じように保つことができます。固定の幅を持つ '#header'の中に新しいラッパー要素が必要です。 – 65Fbef05

+0

さて、再アップロードしました。キャッシュのリフレッシュやブラウザのリフレッシュを行ってください。あなたが分かるように。解像度が小さくなると縮小しますが、すべての要素が縮小され、すべてが収まります。私がしたいのは、解像度が小さすぎてスクロールバーが表示されなければ、スクロールしてすべてを見ることができない場合です。私が言っていることを知っている?ありがとうございました。 –

1

あなたが重ならないように、あなたのナビゲーションをしたい場合は、以下の

#navigation { 
width: 500px; 
height: 100px; 
padding-top: 52px; 
position: fixed; // CHANGE FROM RELATIVE TO FIXED 
left: 770px;  // ADD THIS BIT OF POSITIONING (ADJUST AS NECESSARY) 
float: right;  //REMOVE THIS FLOAT 
text-align: center; 
vertical-align: middle; 

} 
+0

ありがとう:-D。私は助けに感謝します。 –

関連する問題