Я определил несколько 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>
Спасибо!