Почему в сафари 12 на маке отображаются кривые стили?

Question

[Алексей Комоса]

Здравствуйте! Подскажите пожалуйста такую вещь - почему в сафари 12.1.2 стили сайта отображаются очень криво? Хотя во всех других браузерах проблем нет.

Comments

[Ankhena]

Очевидно потому что на сайте использованы свойства, которые 12ый сафари не понимает или понимает не так

[Алексей Комоса]

Ankhena, У вас мак?

[WapSter]

komosa, а зачем иметь мак, если причина очевидна?

[Алексей Комоса]

WapSter, да глянуть на новой версии сафари, может и менять не чего.

[Ankhena]

komosa, откройте browserstack и проверьте

Answer 1

[Vlad Volkov]

Из-за кроссбраузерности.

Здесь можно проверить поддерживает ли бразер конкретное свойство (на примере flexbox):
https://caniuse.com/flexbox



Нужно добавить reset.css
И писать стили уже с добавлением префиксов.

Примеры префиксов:
-moz- используется в Firefox;
-ms- используется в Edge и Internet Explorer;
-webkit- используется в Safari, Chrome и браузерах на основе движков WebKit и Blink;
-o- — используется в старых версиях браузера Opera, работающего на движке Presto. С 2013 г. Opera перешла на движок Blink.

Пример кода:

-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;

Или использовать Gulp/Webpack, которые автоматом могут добавить нужные префиксы.