Гибкий блок работает не так, как ожидалось

#html #google-chrome #css #stylesheet

#HTML #google-chrome #css #таблица стилей

Вопрос:

Хорошо, я использую Chrome для этого.

У меня есть div, для которого я определил display: -webkit-box; . Внутри этого div есть 7 divs, которые есть у всех -webkit-box-flex: 1; .

Однако первый div меньше остальных. Какие-нибудь мысли у кого-нибудь?

Комментарии:

1. Пожалуйста, ваш код.

2. Я создал предварительный просмотр cssdesk: cssdesk.com/rxRum Это прекрасно работает в Chrome. Блоки имеют почти одинаковый размер. Пожалуйста, примите это как начало для уточнения вашего вопроса.

3. Вы правы, на самом деле я ошибся. Я предполагаю, что webkit-box-flex заполнит оставшееся пространство. У моего первого элемента не было текста, у других был, поэтому он был меньше.

Ответ №1:

Я не думаю, что 7 блоков в div шириной 80% дадут вам равномерно расположенные столбцы. Даже игра с границей последнего столбца или установка родительского значения 960 пикселей. 7 просто не входит в него равномерно

Ответ №2:

По-видимому, я неправильно понял модель box. В то время я был в замешательстве и думал, что все divs будут равны, но на самом деле это оставшееся пространство добавляется одинаково.