Firefox ширина вопроса

Question

Я недавно сделал свой портфель для веб-разработчиков: http://rafaelmuttoni.com/ и все выглядело нормально.

Пока случайный парень не открыл проблему в моем репо по поводу проблемы с размером в Firefox .

Я просто не могу понять, почему это происходит ТОЛЬКО в Firefox.

При наведении курсора на панель навигации элементы списка просто go огромные.

Вы можете проверить или go по этой ссылке, которая является стилизованным файлом панели навигации: https://github.com/rafaelmuttoni/rafaelmuttoni.com/blob/master/src/components/Navbar/styled.js

Вы можете проверить проблему на этом изображении

Спасибо.

Answer 1

Проблема начинается из-за тега svg . Они не имеют собственного фиксированного размера и зависят от размера родительского элемента. Каким-то образом в Firefox они реагируют на масштабирование родительской ширины.

Я просто пытаюсь установить исправление видимости в css значков SVG, и это помогло.

.dQgIel {
width: 32px;
}

Просто добавьте его в существующий css

.dQgIel {
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
    width: 32px; /*the cure*/
}