2012-05-13 13 views
1

私は大きな背景画像をブラウザウィンドウのサイズに伸ばしたいと思っています。これにより、サイトの残りの部分をナビゲートしますが、スクロールせずにブラウザウィンドウのサイズに関係なく表示されません(http://whiteboard.isがこれの良い例です)。画像はブラウザのサイズに垂直に伸びません

私は以下のコードを使用していますが、水平に伸びている間は、最小の高さから垂直に伸びません。何か案は?

HTML

<body> 
<section id="first-section"> 
</section> 
</body> 

CSS

body, html { 
    font-family: Helvetica, Arial, sans-serif; 
    margin: 0; 
    padding: 0; 
    height: 100%; 
    } 

#first-section { 
    background: url(1.jpg) no-repeat center center; 
    background-attachment: fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    min-width: 1024px; 
    min-height: 768px; 
    } 
+0

は、私はそのような質問を投稿する前にjsfiddle例の作成をお勧めします:例http://jsfiddle.net/6VVUG/この時間を働いた御馳走を:)働い –

答えて

2

はあなたにもheight:100%を書くことができますように。

#first-section { 
    background: url(1.jpg) no-repeat center center; 
    background-attachment: fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    min-width: 1024px; 
    min-height: 768px; 
    height:100%; 
    } 
+0

おかげで、以前に動作しませんでした。たぶん私はそれに影響を与えていた何かを削除しました。ありがとう:) –

関連する問題