@Sprite1985

Bootstrap 4. Как расположить текст посередине масштабируемого изображения?

Добрый день!
Есть изображение (фон), масштабируемое с сохранением пропорций при изменении размера окна браузера.
Не могу вставить текст по центру(
Пишу на Bootstrap 4, наверняка там уже есть этот функционал.
Делаю так:
<div class="container-fluid">
  <img src="img/image.jpg" class="w-100" alt="">
    <div class="row">
      <h1 class>Текст</h1>
    </div>
  </div>  	  		
</div>

При этом надпись располагается под изображением. Как расположить надпись посередине?
  • Вопрос задан
  • 56 просмотров
Решения вопроса 1
Пригласить эксперта
Ответы на вопрос 2
Yadalay
@Yadalay
Php, Mysql, Html, Css, Js/Jquery/Ajax, Laravel
Bootstrap тут не при чём. Вам нужно использовать position: absolute для того, чтобы накладывать текст на изображение в Вашем примере. Ещё можно сделать div с background указанного изображения, задать статическую (или минимальную) высоту этому div'у, а внутри расположить текст. А самому div'у прописать:
display: inline-flex;
display: -moz-inline-box;
display: -ms-inline-flexbox;
display: -webkit-inline-flex;
align-items: center;
-ms-flex-align: center;
-webkit-align-items: center;
justify-content: center;
-webkit-justify-content: center;
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
27 окт. 2020, в 22:07
50000 руб./за проект
27 окт. 2020, в 21:27
20000 руб./за проект
27 окт. 2020, в 20:58
60000 руб./за проект