Установить фоновое изображение в нижней части div с изменением размера - PullRequest
1 голос
/ 08 декабря 2010

Я определил несколько div, которые имеют частично прозрачные фоны, которые перекрывают друг друга, я хочу привязать один из них к нижней части div.Однако, если я добавлю содержимое в div, фон будет привязан там, где я указал min-height.Это происходит во всех браузерах, кроме IE.Это мой код:

#content1 {
    background-image: url(image/main_background.png);
    margin-left: 12px;
    margin-right: 12px;
    /*margin-top: 0px;
    margin-bottom: 0px;*/
    border-style: solid;
    border-left-width: 3px;
    border-right-width: 3px;
    border-top-width: 0px;
    border-bottom-width: 0px;
    border-color: #000000;
    width: 976px;
    min-height: 355px;
    float: left;    
    }
#content2 {
    background-image: url(image/top_gradient.png);
    background-repeat: repeat-x;
    width: 976px;
    min-height: 355px;
    }
#content3 {
    background-image: url(image/bottom_gradient.png);
    background-repeat: repeat-x;
    background-position: 0% 100%;
    width: 976px;
    min-height: 355px;
    }
#content4 {
    background-image: url(image/top_background.png);
    background-repeat: no-repeat;
    width: 976px;
    min-height: 355px;
    clear: both;
    }

и

<div class="container">
    <div id="content1"><div id="content2"><div id="content3"><div id="content4">
        <div id="content_elements">
            <::content::>
        </div>
        <div id="sidebar_elements">
            <::sidebar::>
        </div>
    </div></div></div></div>
</div>

Спасибо!

1 Ответ

0 голосов
/ 08 декабря 2010

Работает ли это: background: url('background.png') no-repeat bottom;, поэтому добавьте внизу после без повтора .

...