Почему некоторые элементы CSS не работают в Safari?

Вот мой код:

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-size: 160;
    font-family: Cochin;
}

body {
    width: 90%;
    margin: auto;
}

header {
    background: url("../images/background_cover.jpg");
    background-size: cover;
    h1, h3 {
        display: grid;
        place-items: center;
        color: white;
        padding: 1.5rem;
    }
    h3 {
        font-size: clamp(1rem, 1.2vw, 3rem);
        padding: 2rem;
    }
}

Все остальное работает нормально, кроме блока h1, h3 {}. Я также протестировал несколько других CSS-файлов, которые не принадлежат мне, и проблема, похоже, не устранена. Я ненадолго переключился на Chrome, и кажется, все выглядит отлично, но я бы предпочел разобраться в проблеме и продолжить работу с Safari.

Я также искал решения в Интернете, очищал кеш, отключал расширения, но, похоже, ничего не помогло.

какая версия сафари?

j08691 23.02.2024 23:55
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
1
1
526
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вложение CSS — это совершенно новая функция, добавленная в CSS, вероятно, поэтому она не работает в Safari.
Вместо этого вы можете использовать Sass или просто не вкладывать селекторы.

caniuse.com/css-nesting указывает на то, что Safari получил эту функцию в декабре, так что да, я бы пока не стал на нее полагаться. Многие люди еще не используют Safari 17.2+.
ceejayoz 23.02.2024 23:34

обновление моего Safari сработало, лол. Спасибо!

maira 24.02.2024 00:45

Другие вопросы по теме