html - CSS 在 Chrome 中不起作用，但在 Firefox 中起作用

Question

我有一个用于提供建议的文本区域。下面是两张截图；一个在 Firefox 中，一个在 Chrome 中。 Firefox 是正确的，我不知道为什么它在 Chrome 中显示不正确。谁能解释为什么会发生这种情况？它在本地 Chrome 中有效，但在我发布到 Azure 时无效。

Suggestion Box FireFox

Suggestion Box Chrome

我的风格是:

#txtSuggestion {
    position: relative;
    font-size: 16px;
    height: auto;
    padding: 10px;   
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box;  
    width: 500px;
    height: 100px;
    border: 3px solid #cccccc;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

我在页面上的 div 是:

<div id="suggestion">
    <h2 style="text-align:center;">Suggestion</h2>
    <h3 style="text-align: center;" id="successText"></h3>
    <textarea id="txtSuggestion"  spellcheck="false">   </textarea>        
    <div style="text-align:center; padding-top: 20px;">
        <span class="btn btn-sm btn-success" id="btnSubmit" onclick="SuggestionSubmit();">Submit</span>
    </div>
</div>

Answer 1

尝试按 Shift + F5 在 Chrome 中强制刷新缓存