Почему в двух одинаковых верстках разное поведение флекса?

Question

[godsplane]

Всем привет, я в ступоре как это работает. Один и тот же кусок кода работает по разному в разных блоках.
Никакого наследования у какого то из блоков нет,почему это так работает?Если убирать флекс, то иконка появляется.

<div class="form-icon-wrapper">
        <div class="ico">
          <img src="wp-content/themes/default-theme/img/ico/phone-2.png" alt="">
        </div>
        [mask* mask-737 class:form-input "+7(__)__-__-__" "[phone]"]
 </div>

.form-icon-wrapper {
    display: flex;
    align-items: center;
    margin-top: 10px;
    margin-bottom: 18px;
}

Answer 1

[Lord_Dantes]

Видно же, что у иконки ширина 0px, инпут при флексе "выдавливает" картинку своей шириной. Задайте либо max-width либо ширину иконке