Как сверстать два блока?
445
24 ноября 2016, 10:16
Как сверстать два блока: один слева, второй справа, ширина 1-го зависит от внутреннего контента, а 2-ой от ширины 1-го блока?
Answer 1
Насколько я знаю, чтобы добиться такого результата с помощью css, есть только один способ: использование флексбоксов. Необходимо задать родителю display: flex;, а тому из блоков, ширина которого определяется шириной другого блока прописать свойство flex: auto;.
html, body {
margin: 0;
}
.flex-container {
display: flex;
}
.flex-container div {
display: flex;
align-items: center;
height: 40px;
padding: 0 15px;
}
.flex-container .item-title {
background: #a7a7a7;
}
.flex-container .item-descr {
flex: auto;
background: #cecece;
}<div class="flex-container">
<div class="item-title">Наименование товара:</div>
<div class="item-descr">Some product</div>
</div>
-
12:23
-
20:41
-
06:31
-
21:28
-
22:18
-
08:00
-
13:46
-
10:14
-
18:32
Сборка персонального компьютера от Artline: умный выбор для современных пользователей
ТОП-10
- Почему SERVER_ADDR имеет не тот IP 49908 visits
- Как заменить $_SERVER[REMOTE_ADDR] на IP клиента в PHP за двумя Nginx? 31901 visits
- Хочу вывести несколько строк из массива в один div, выводит только много undefined; подскажите, что делать? 25873 visits
- Как через css изменить цвет png изображения? 11721 visits
- Blob video url download 11267 visits
- Php curl запрос через прокси с авторизацией 10662 visits
- Работа с captcha vk api 9467 visits
© "hostciti.net" 18.12.2025 | 18:28