Существует некий блок:
<div class="head">
</div>
Ему задан стиль:
.head {
width: 600px;
height: 200px;
overflow: hide;
}
В этом блоке есть картинка и два других элемента:
<div class="head">
<img class="head_bg_img" src="img/a.jpg">
<div class="head_info">
Информация о компании
</div>
<h1 class="name">Имя компании</h1>
</div>
Для трёх элементов заданы такие стили:
.name, head_info{
position: relative;
float: left;
}
.head_bg_img {
position: relative;
width: 100%;
top: -200px;
}
По идее, элемент head_bg_img должен быть на заднем фоне, но он перекрывает остальные два. Пробовал применять также и z-index
но иэто не увенчалось успехом. Как быть?