内边距不显示（仅当保存CSS时）

Question

因此，我的输入和文本区域的填充显然不会显示，除非我打开页面并故意保存CSS文件，它将立即具有我的填充设置，但是当我从另一个页面定向到该页面时，它将显示零填充。这是CSS代码：

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

#bg{
    background-color: #264d7c;
}
.title{
    font-weight: 800;
    margin: auto;
    text-align: center;
    font-size: 3rem;
    color: white;
}

.mainform{
    margin-left: 3rem;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: start;
    display: flex;
    gap: 20px;
}

input, textarea{
    background-color: #264d7c;
    border: solid white;
    color: white;
    padding: 15px;
}



.submit{
    font-weight: 600;
    color: white;
    padding: 10px 30px;
    border-radius: 30px;
    border: solid white;
}

.texts{
    color: white;
    font-weight: 600;
}

.wrappertable{
    margin-top: 2rem;
}

table, th,td{
    border: solid black;
    padding: 20px;
    border-collapse: collapse;
    text-align: left;
    font-size: 1.3rem;
    width: 20%;
    margin: auto;
}

th{
    font-weight: 500;
}

.legend{
    font-weight: 700;
}

这是我的 html 代码的表单部分和头部：

<div class="wrapperform">
          <!-- action="https://api.web3forms.com/submit" method="POST"  -->
            <form class="mainform">
                <span class="texts">Nama (apabila ingin anonim isi '-')</span>
                <input type="hidden" name="access_key" value="3c883bb7-c619-430f-b6c6-eac06e9f62d1">
                <input type="text" placeholder="Your name" name="Name" class="name">
                <span class="texts">Aspirasi</span>
                <textarea class="aspirasi" placeholder="Tuliskan aspirasimu" name="Aspirasi" id="Aspirasi" cols="30" rows="10"></textarea>
                <button class="submit" type="submit">Kirim</button>
            </form>
        </div>

<meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
    <title>Thalation | Cakradhana Nawasena</title>
    <link rel="icon" type="image/x-icon" href="/bahan/simple.png">

    <!-- Google Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="thalation.css">
        <script src="./hamburger.js" defer></script>
        <script src="https://web3forms.com/client/script.js" async defer></script>

我只尝试使用两个设备刷新和刷新，结果都是一样的。这是描述问题所在的图像：

Answer 1

您只使用 html 和 css 吗？如果涉及任何“服务器”（例如 xampp 或 uwampp），那么这可能是一个令人耳目一新的问题。不管怎样，这都是一个导航器问题（对我来说，chrome 也有类似的问题，但当涉及到 firefox 或 opera 时，这很酷）。