@fron321

Как сверстать содержание в квадратном блоке?

Нужно чтобы при уменьшении ширины окна браузера квадрат уменьшался и по высоте и по ширине. В квадрате должно быть содержание такого плана как на рисунке, чтобы при сжатии точки никуда не пропадали и при переносе слов точки никуда не пропадали.60143248bace7483432212.png
  • Вопрос задан
  • 83 просмотра
Пригласить эксперта
Ответы на вопрос 2
Получите код:

<div class="container">

<div class="row">
  <div class="v-1">Lorem ipsum dolor sit amet.</div>
  <div class="dotted"></div>
  <div class="v-2">Lorem ipsum dolor sit amet.</div>
</div>  

<div class="row">
  <div class="v-1">Lorem ipsum dolor sit amet.</div>
  <div class="dotted"></div>
  <div class="v-2">Lorem ipsum dolor sit amet.</div>
</div>  

</div>


.container{
  display: flex;
  flex-direction: column;
  width: 100%
}

.row{
  display: flex;
  width: 100%;
}
.v-1{
  width: 20%;
}

.dotted{
  width: 80%;
  border-bottom: 1px dotted silver;
}
.v-2{
  width: 20%;
}


Ответ написан
Ankhena
@Ankhena Куратор тега CSS
Нежно люблю верстку
Держите
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
07 мар. 2021, в 03:18
1500 руб./за проект
06 мар. 2021, в 22:58
70000 руб./за проект
06 мар. 2021, в 22:36
10000 руб./за проект