Как избавиться от бага на IOS?

Question

[Дмитрий Щербаков]

Сверстал сайт, на windows всё показывается отлично, выгрузил на тестовый хост, вот ссылка host1692312.hostland.pro
Но как только он открывается на каком то яблочном девайсе, межстрочные и межбуквенные интервалы сильно увеличиваются, всё расползается. Как пофиксить это, подскажите пожалуйста?
Вот скрины с IOS

Answer 1

[alexalexes]

Скорее всего нужен svg формат для гарнитуры шрифта.
PS: по стопам вопроса Как подключить шрифт для iOS?

Comments

[Дмитрий Щербаков]

Это никак не решило проблему, причем я поставил на проверку svg первым шрифтом

@font-face {
	font-family: "PFAgoraSansPro-Black";
	src: url("../fonts/PFAgoraSansPro-Black/PFAgoraSansPro-Black.svg");
	src: url("../fonts/PFAgoraSansPro-Black/PFAgoraSansPro-Black.svg?#iefix") format("embedded-opentype"),
            url("../fonts/PFAgoraSansPro-Black/PFAgoraSansPro-Black.eot") format("svg"),
			url("../fonts/PFAgoraSansPro-Black/PFAgoraSansPro-Black.woff") format("woff"),
			url("../fonts/PFAgoraSansPro-Black/PFAgoraSansPro-Black.ttf") format("truetype");
	font-style: normal;
	font-weight: normal;
}

@font-face {
	font-family: "PFAgoraSansPro-Bold";
	src: url("../fonts/PFAgoraSansPro-Bold/PFAgoraSansPro-Bold.svg");
	src: url("../fonts/PFAgoraSansPro-Bold/PFAgoraSansPro-Bold.svg?#iefix") format("embedded-opentype"),
             url("../fonts/PFAgoraSansPro-Bold/PFAgoraSansPro-Bold.eot") format("svg"),
			 url("../fonts/PFAgoraSansPro-Bold/PFAgoraSansPro-Bold.woff") format("woff"),
			 url("../fonts/PFAgoraSansPro-Bold/PFAgoraSansPro-Bold.ttf") format("truetype");
	font-style: normal;
	font-weight: normal;
}

@font-face {
	font-family: "PFAgoraSansPro-Light";
	src: url("../fonts/PFAgoraSansPro-Light/PFAgoraSansPro-Light.svg");
	src: url("../fonts/PFAgoraSansPro-Light/PFAgoraSansPro-Light.svg?#iefix") format("embedded-opentype"),
             url("../fonts/PFAgoraSansPro-Light/PFAgoraSansPro-Light.eot") format("svg"),
			 url("../fonts/PFAgoraSansPro-Light/PFAgoraSansPro-Light.woff") format("woff"),
			 url("../fonts/PFAgoraSansPro-Light/PFAgoraSansPro-Light.ttf") format("truetype");
	font-style: normal;
	font-weight: normal;
}

@font-face {
	font-family: "PFAgoraSansPro-Medium";
	src: url("../fonts/PFAgoraSansPro-Medium/PFAgoraSansPro-Medium.svg");
	src: url("../fonts/PFAgoraSansPro-Medium/PFAgoraSansPro-Medium.svg?#iefix") format("embedded-opentype"),
             url("../fonts/PFAgoraSansPro-Medium/PFAgoraSansPro-Medium.eot") format("svg"),
			 url("../fonts/PFAgoraSansPro-Medium/PFAgoraSansPro-Medium.woff") format("woff"),
			 url("../fonts/PFAgoraSansPro-Medium/PFAgoraSansPro-Medium.ttf") format("truetype");
	font-style: normal;
	font-weight: normal;
}
@font-face {
	font-family: "PFAgoraSansPro-Regular";
	src: url("../fonts/PFAgoraSansPro-Regular/PFAgoraSansPro-Regular.svg");
	src: url("../fonts/PFAgoraSansPro-Regular/PFAgoraSansPro-Regular.svg?#iefix") format("embedded-opentype"),
             url("../fonts/PFAgoraSansPro-Regular/PFAgoraSansPro-Regular.eot") format("svg"),
			 url("../fonts/PFAgoraSansPro-Regular/PFAgoraSansPro-Regular.woff") format("woff"),
			 url("../fonts/PFAgoraSansPro-Regular/PFAgoraSansPro-Regular.ttf") format("truetype");
	font-style: normal;
	font-weight: normal;
}
@font-face {
	font-family: "PFAgoraSansPro-UltraBlack";
	src: url("../fonts/PFAgoraSansPro-UltraBlack/PFAgoraSansPro-UltraBlack.svg");
	src: url("../fonts/PFAgoraSansPro-UltraBlack/PFAgoraSansPro-UltraBlack.svg?#iefix") format("embedded-opentype"),
             url("../fonts/PFAgoraSansPro-UltraBlack/PFAgoraSansPro-UltraBlack.eot") format("svg"),
			 url("../fonts/PFAgoraSansPro-UltraBlack/PFAgoraSansPro-UltraBlack.woff") format("woff"),
			 url("../fonts/PFAgoraSansPro-UltraBlack/PFAgoraSansPro-UltraBlack.ttf") format("truetype");
	font-style: normal;
	font-weight: normal;
}

[alexalexes]

MaxKorz правильно сказал про размерность шрифтов, Сафари не понимает ее.
PS: Для отладки яблочного отображения можно использовать настольную версию Safari, пока она еще не слишком старая и баги верстки она повторяет.

[alexalexes]

Согласен, но тем не менее и эта версия указывает на проблему.