Приветствую. Есть у меня секция у которой 1 картинка не прозрачная + еще 1 прозрачная и полупрозрачный фон. При добавлении контента блок оный не растягивается автоматически в высоту. Я делаю что-то не так или вообще всё не так.
Можете посмотреть код и сказать в чём моя ошибка? Как можно это исправить?
https://jsfiddle.net
Все стили которые находятся в
<div class="search_bg"> я пробовал добавлять через
&:after для
<div class="container">, но тогда получается еще хуже.
<div class="container">
<div class="search_bg">
<div class="wrapper">
<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Non quas laboriosam consequatur laborum itaque est ducimus voluptatibus, deserunt odit architecto sapiente quam ullam, illo quidem cumque consectetur quae corporis dolores.</div>
<div>Aperiam eos animi quis officiis deserunt temporibus, velit, tempore est fugit esse, repellat quisquam architecto ducimus rerum minus debitis nesciunt. Unde, quasi. Iusto quo quidem, distinctio nam, iste et sint!</div>
</div>
</div>
</div>
Код:
|
.container{
min-height: 449px;
position: relative;
background-image: url(http://s018.radikal.ru/i524/1701/57/04977bc315b6.jpg);
background-repeat: no-repeat;
background-size: cover;
}
.wrapper{
padding: 40px 0;
width: 70%;
margin: 0 auto;
color: #fff;
}
.search_bg{
width: 100%;
height: 100%;
left: 0;
top: 0;
background-color: rgba(0, 0, 0, 0.7);
background-image: url(http://s002.radikal.ru/i198/1701/f6/b574a41380c1.png);
background-repeat: no-repeat;
background-size: cover;
position: absolute;
} |