css - ナビゲーション バーとの Firefox のスタイルの不一致

Question

Chrome/Safari と Firefox の間で CSS スタイルの問題が発生しています。Chrome と Safari の両方で、非表示のドロップダウンは正しく配置されていますが、Firefox では、サブナビゲーション メニューが数ピクセルずれています。両方のブラウザの検査ツールで問題を調べたところ、Firefox は #main_nav_bar ul を Chrome よりも 10px 広くしているようです。私が抱えている問題は、ナビゲーション バーの外観を台無しにせずに、これを変更する方法がわからないことです。

リンクはhttp://www.tamidgroup.orgです。

修正に関する提案は大歓迎です。

Answer 1

必ずそこに追加doctypeしてください。これらのブラウザーをメディア クエリでターゲットにすることもできます。

クロムとサファリの例

@media screen and (-webkit-min-device-pixel-ratio:0){
   //add your browser specific code here
}

こうすることで、あるブラウザーから別のブラウザーに表示される特定の問題をターゲットにすることができます。