Google ChromeでWebページを作成しています。以下のスタイルで正しく表示されます。
table {
display: table;
border-collapse: separate;
border-spacing: 2px;
border-color: gray;
}
注意すべきは、これらのスタイルを定義していないことです。Chromeの開発ツールでは、CSSファイル名の代わりにuser agent stylesheetと書かれています。
これで、フォームを送信して何らかの検証エラーが発生すると、以下のようなスタイルシートが表示されます。
table {
white-space: normal;
line-height: normal;
font-weight: normal;
font-size: medium;
font-variant: normal;
font-style: normal;
color: -webkit-text;
text-align: -webkit-auto;
}
table {
display: table;
border-collapse: separate;
border-spacing: 2px;
border-color: gray;
}
これらの新しいスタイルの「フォントサイズ」がデザインの邪魔をしています。できれば、Chromeのデフォルトスタイルシートを完全に上書きして、スタイルシートを強制的に変更する方法はありませんか?
対象となるブラウザは何ですか?ブラウザによって、デフォルトのCSSルールは異なります。これらのデフォルトを取り除くために、meyerweb css resetやnormalize.cssのようなCSSリセットを入れてみてください。Google "css reset vs normalize"でその違いを確認してください。
ユーザーエージェントスタイルシート」という概念については、CSS 2.1仕様のCascadeの項をご参照ください。
ユーザーエージェント・スタイルシートは、ユーザー自身のスタイルシートで設定したものに上書きされます。ユーザーエージェント・スタイルシートは、ページやユーザーが提供するスタイルシートがない場合、ブラウザはコンテンツを何らかの方法でレンダリングする必要があり、ユーザーエージェント・スタイルシートはこれを記述するだけです。
ですから、もしユーザーエージェントのスタイルシートに問題があると思うなら、実際にはマークアップかスタイルシート、あるいはその両方(あなたは何も書いていませんが)に問題があるのです。