Ольга, ну так а что вы хотите? Когда вы картинку ставите на фон, браузер не знает о соотношении сторон этой картинки и вставляет её по размеру блока.
Если хотите, чтобы было автоматическое соотношение сторон, то делайте с помощью img, но тогда это будет блок и надо будет шаманить с absolute, чтобы разместить контент.
ae0lian, эх, наверное, несколько лет опыта в работе на рынок США действительно могут мне врать...
Ссылку на спецификацию такой работы с Retina можете дать для работы cover? Ибо где вы прочитали, что зачем-то какой-то размер фона с какого-то бока нужно ставить для этого, — я не знаю.
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
/* Тут ваш код для чистой retina, начинающейся от минимального размера viewport в два раза меньше физического */
}
Вот пример, где работает cover везде и безо всяких проблем. Проверяется это тем, что там две картинки на фон, первая с надписью X1 (обычная), вторая — с надписью X2 (retina). Везде background-size: cover. И всё работает:
На обычном экране грузит X1:
На экране, который проходит проверку retina — X2
Android Chrome тоже всё понимает и, если экран высокого разрешения, использует retina-вариант (X2):
ae0lian, вы, видимо, не совсем понимаете смысл Retina, связи разрешения картинки, экрана и масштабирования.
На Retina-экранах размер viewport в 2, 3, 4 или более раза меньше физического разрешения экрана, поэтому обычные картинки на них смотрятся размытыми, несмотря на то, что viewport может быть всего лишь, например 375px по ширине (iPhone XS) при реальном разрешении 1125px (в 3 раза больше), поэтому картинка должна быть в 3 раза больше, чтобы заполнить реальное разрешение без суб-пиксельного масштабирования.
Ставьте ссылку на ваш retinа-ресурс, и все у вас будет нормально + cover. Он же у вас с разрешением выше, чем обычный?
Начнем с того, как у вас выглядит подключеник и какие форматы и начертания прописаны во @font-face?
При условии, что у вас подключаются WOFF и WOFF2, а сам шрифт не косой, то дальнейшие инструменты полноценной оптимизации — ручные (удаление ненужных глифов, оптимизации векторных путей).
Если что, такого свойства, как вы хотите, нет. Потому что нет свойства, которое умеет автоматически менять высоту строки, чтобы вписывать ваш текст в блок по высоте.
Вот это и есть касательно absolute.