在Chrome和Mozilla中协助使用CSS

我正在开发一个简单的网站，我的CSS有一些问题。在IE中，除了导航选项卡上的角边外，它看起来很好。我认为IE可能不支持这一点，但是在Mozilla和Chrome中，它将我的导航栏放在两行上。当它在CSS中设置为橙色时，它还将我的h1的颜色更改为黑色。你能找个人帮我吗，谢谢

正文{
背景色:#282828 ;；
}
h1{
文本对齐：居中；
颜色：#FFCC33；
}
#导航栏{
宽度：900px；
}
#导航杆#支架{
高度：64px；
边框底部：1px实心#FFCC33；
宽度：880px；
左侧填充：25px；
}
#navbar#holder ul{列表样式：无；
保证金：0；
填充：0；
}
#navbar#holder ul li a{
文字装饰：无；
浮动：左；
右边距：10px；
字体系列：“Arial黑色”，小工具，无衬线；
颜色：#FFCC33；
边框：1px实心#FFCC33；
边框底部：无；
填充：20px；
宽度：200px；
文本对齐：居中；
显示：块；
背景:"282828 ;；
-moz边界半径：1em 4em 1em 4em；
边界半径：1em 4em 1em 4em；
}
#导航栏#持有者ul li a:悬停{
背景:#FFCC33；
颜色:#282828 ;；
文本阴影：1px 1px 1px#FFCC33；
}
#导航杆#支架ul li{
显示：内联；
}
#持有人ul li a#onlink{
背景:#FFCC33；
颜色:#282828 ;；
边框底部：1px实心#FFCC33；
}
#持有人ul li a#onlink：悬停{
背景:#FFCC33；
颜色：#003399；
文本阴影：1px 1px 1px#000；
}

正如minitech评论的那样，h1变为橙色是因为当您真正想只选择

h1

标记时，您在

h1

选择器上使用了

至于将导航包裹在两行上，这是因为您的

s内

的总宽度大于您给定的
#holder
的宽度。填充将添加到元素的宽度上。所以（200+20+20）*4=960，而不是880。也不要忘记边距和边框。在你的情况下，右边是另一个10px。每边加1件，作为边界。所以1008px是所有这些元素的实际宽度

另一个技巧：使用类而不是ID来设置CSS样式。HTML很容易遇到非唯一ID的问题。页面上的所有id都应该是唯一的，但是页面上有许多
id=onlink
。您可以在一个页面上拥有许多相同的类名，而不会有任何问题。
您的
是否有
id
？另外，您可以添加一个吗？h1没有id，从未使用过JFIDLE。请添加一个指向您页面的链接或一个JSFIDLE，这样我们就可以看到除了您复制的CSS之外，还有什么可能影响您的HTML。谢谢编辑-使用JSFIDLE，您可以将所有css、html和javascript复制到单独的框中，然后点击“更新”按钮，然后将链接粘贴到您的问题或此处的评论中。完成，谢谢您的html非常无效，并且您使用了
的ID选择器；这就是为什么它不是橙色的。在我读到第三段之前，我会投票支持你的答案。“总是为JS使用ID，为样式设计使用类”，作为某种规则，这太麻烦了，不实用。不过，感谢你的评论，我本可以说得更清楚一点，在我开始使用CSS之前，我不会把它作为一条经验法则，因为这只是我最初的思考过程。我已经修改了答案，很公平。但即使是刚开始，我也不推荐这样的做法。毕竟，当我想设计一个已经有ID的元素的样式时，我不会创建一个新类。当我想使用jQuery以一个元素类为目标时，我当然不会创建一堆新ID。当“开始”时，最好把好习惯作为你的核心基础，因为所有的习惯都会持续太长时间。谢谢你的建议，我很感激你的帮助。使用类是有意义的！