0

Есть значит у меня див с фоновым изображением в CSS. И внутри этого дива див с наложением цвета.

<div class="image">
    <div class="image-overlay"></div>
</div>

.image {
width: 100%;
height: 100%;
background-image: url('../Images/headphoto.jpg');
position: relative; }

.image-overlay {
    width: 100%;
    height: 100%;
    background: rgba(28,66,111,0.6);
    position: relative;
}

А есть еще див с текстом, который должен отображаться поверх фонового изображения. Задаю ему такие параметры:

.text-block {
width: 300px;
height: 200px;
top: 362px; left: 0; bottom: 0; right: 0;
border: 2px solid black;
color: white;
margin: 0 auto;
position: absolute;}

Центрирую див и все нормально отображается. Но как только я увеличиваю или уменьшаю масштаб страницы (ctrl +; ctrl -), то див с текстом начинает выпадать. Он сохраняет свою позицию в центре относительно экрана. Но выходит за границы body.

Где моя ошибка? Как добиться того, чтобы див с текстом оставался на своей позиции несмотря ни на что и при этом отображался поверх фонового изображения?

1
  • 1
    Покажите работающий код. Этот работать не может. Сделайте сниппет и вставьте в вопрос. Commented 9 февр. 2017 в 10:53

1 ответ 1

-2

overflow-hidden для родителя, в котором всё это лежит)

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.