Не работает max-width в IE11?

Question

[Валерий Жмышенко]

Доброго времени суток!
При использовании max-width для

.section2__item

в IE11 блоки не размещаются по ширине всего блока-родителя с использованием flexbox.

А при использовании для

.section2__item

свойства просто width все работает нормально.

<section class="section2">
      <div class="container">
        <div class="section2__items-block">
          <div class="section2__item">
            <div class="section2__item-img item1">
              <img src="./img/block2_1.png" alt="item1" />
            </div>
            <div class="section2__item-title">title</div>
            <div class="section2__item-description">
              description
            </div>
          </div>
          <div class="section2__item item2">
            <div class="section2__item-img">
              <img src="./img/block2_2.png" alt="item2" />
            </div>
            <div class="section2__item-title">
              title
            </div>
            <div class="section2__item-description">
             description
            </div>
          </div>
          <div class="section2__item item3">
            <div class="section2__item-img">
              <img src="./img/block2_3.png" alt="item3" />
            </div>
            <div class="section2__item-title">
             title
            </div>
            <div class="section2__item-description">
             description
            </div>
          </div>
        </div>
      </div>
    </section>

.section2__items-block {
  margin-top: 30px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.section2__item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  width: 30%;
  position: relative;
}

Что я не так делаю или это нормально использовать width. а не max-width?

Comments

[Ankhena]

это нормально использовать width. а не max-width?

Если вы получаете нужный результат, то почему это не будет нормальным?
А вообще зависит от желаемого результата. Ограничить ширину это одно, задать конкретную другое.

max-width задает максимальную ширину блока, т.е. то на сколько блоку можно , а не нужно растянуться.
ИЕ просто переносит заголовок на другую строку (именно на той ширине, на которой вы проверяете) и блок не растягивается на максимальную ширину.

Еще почитайте про flex-shrink и flex-grow.

[Валерий Жмышенко]

Ankhena, а flex-shrink и flex-grow нормально работают с IE11?

[Ankhena]

Валерий Жмышенко, у меня да, попробуйте ;)