FFxSquall
@FFxSquall
Могу писать код, могу не писать

Как динамически растягивать родительский див?

Столкнулся с такой проблемой. Имеется див в котором лежит некий контент в 2 колонки строками. Которые могут быть различной ширины, надо сделать так, что бы родительский див растягивался от минимальной ширины до 100% в зависимости от содержимого. Ниже примерный код.

<div class="parent">
  <div class="col-1">
    <div class="row">
      Тут что-то есть
    </div>
    <div class="row">
     И тут
    </div>
  </div>
  <div class="col-2">
   Тут тоже что и в col-1
  </div>
</div>
  • Вопрос задан
  • 3163 просмотра
Решения вопроса 1
Petroveg
@Petroveg
Миром правят маленькие с#@&ки
1. Контейнер
display:table (inline-table) + max-width:100% + table-layout:fixed (если нужно уравнять ширину колонок)

2. Контейнер
display:inline-block + max-width:100% + font-size:0 + white-space:nowrap (чтобы колонки не прыгнули друг под друга без ширины)
Колонки
display:inline-block + vertical-align:top + font-size:1rem + width:50% (если нужно уравнять ширину колонок) + white-space:normal (если было установлено nowrap)
Можно и float при желании с clearence у потока или overflow у контейнера

3. Контейнер
float + max-width:100%
Колонки
float + width:50% (или другие цифры, не превышающие в сумме 100%)
Точно так же можно и display:inline-block с обнулением и возвратом размера шрифта
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы