Сайт отображается по-разному в разных браузерах

Question

Я пока новичок в html/css/js и у меня возникла проблема с сайтом. В разных браузерах, разное отображение сайта, почему-то при запуске файла из Visual Studio Code у меня всё работает, только при запуске уже захощенного сайта(панель управления "ispmanager") у меня возникают проблемы. Но так не во всех браузерах. В opera и ms egde всё плохо, а в chrome всё ок. А на мак ос во всех браузерах всё плохо. Вот код и скрины сайта.

html:

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width">
    <title>Document</title>
    <link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
    <main class="content">
        <section>
            <h1>Привет</h1>
        </section>
        <section>
            <button id="toggleThemeBtn">Тёмная тема</button>
        </section>
        <script src="script.js"></script>
    </main>
</body>

css:

@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap');
*{
    margin: 0;
    padding: 0;
    font-family: 'Roboto Slab', serif;
}

body{
    min-height: 100vh;
    margin-top: 100px;
    color: rgb(10, 0, 0);
}

.content{
    width: 1000px;
    margin: auto;
    box-shadow: 0 0 3px silver;
    padding: 20px;
    height: calc(100hv - 100px - 40px);
}

button{
    margin-top: 10px;
    padding: 15px 40px;
    border: none;
    background: transparent;
    box-shadow: 0 0 3px silver;
    
}

button:hover{
    box-shadow: 0 0 15px silver;
    background-color: slategrey;
    color: white;
}

button:active{
    box-shadow: 0 0 20px gray;
    background-color: rgb(78, 85, 92);
}

/* Тёмная тема */

body.dark {
    background: rgb(27, 27, 27);
    color: white;
}

body.dark .content{
    box-shadow: 0 0 3px rgb(46, 50, 66);
}


body.dark button{
    box-shadow: 0 0 5px slategray;
    background-color: rgb(255, 255, 255);
}

body.dark button:hover{
    box-shadow: 0 0 15px rgb(73, 73, 73);
    background-color: rgb(64, 71, 78);
    color: white;
}

body.dark button:active{
    box-shadow: 0 0 20px gray;
    background-color: rgb(78, 85, 92);
}

js:

toggleThemeBtn.onclick = () => {
    document.body.classList.toggle("dark")
    toggleThemeBtn.innerText = document.body.classList.contains("dark") ? "Светлая тема" : "Тёмная тема"
}

Опера:

Хром:

Answer 1

Скорее всего проблема с кодировкой сайта, допишите в самом начале <meta charset="utf-8">, думаю поможет.

Answer 2

Огромное спасибо https://ru.stackoverflow.com/users/213565/nazarpunk

Его ответ:

Пустой файл стилей мог остаться в кэше, попробуйте обновить страницу со сбросом кэша. – nazarpunk 12 часов назад

БЛОГ НА HUSL

Сайт отображается по-разному в разных браузерах

Ответы (2 шт):