Fredo14
@Fredo14
школьница

Почему не работает grid-template-columns: 1fr 1fr?

Есть такой код: два div'а, одинаковых по ширине, в первом может быть много текста - нужно, чтобы весь, который не помещается, обрезался. Однако вместо этого не срабатывает grid-template-columns: 1fr 1fr, и первый div растягивается по тексту. В чём может быть причина и как это исправить?
i4SL.png
<main>
  <div class="wrap">
    <div>
      <p>Жили-были дед да баба.</p>
      <p>Была у них курочка ряба.</p>
      <p>Снесла курочка яичко, не простое — золотое.</p>
      <p>Дед бил, бил — не разбил.</p>
      <p>Баба била, била — не разбила.</p>
    </div>
    <div>Пустой div</div>
  </div>
</main>

main {
  width: 300px;
}
.wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
p {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow-x: hidden;
}
  • Вопрос задан
  • 41 просмотр
Решения вопроса 1
MykolaPetiukh
@MykolaPetiukh
Директор кафе
Почитай, что за единица такая, это fr
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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