CSS 重置会覆盖 Firefox 中的指定元素
我有一个样式表，我在开始时应用了重置。这会将大量标签的边距和填充设置为 0 等。但是，稍后在样式表中，我将边距和填充应用于特定标签。然而，出于某种原因，Firefox 无法在非常特定的位置点上完成重置。
这是正在发生的事情的一个例子。下面是我的重置：
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
这是我添加的一行，用于为具有类 modified 的特定 div 元素提供样式：
.modified { padding-top: 5px; align:center; }
在 Safari 中，当我检查该特定 div< /code>，我看到我在样式表中创建的行并且似乎已应用。
在 Firefox 中，当我在同一个 div 上使用 firebug 时，我只看到我的 css 重置代码。
有办法解决这个问题吗？我尝试过 !important，并将其重新命名为 div.modified 而不仅仅是 modified，但这也不起作用。
I have a stylesheet where I apply a reset in the beginning. This sets the margin and padding to 0, among other things, for a slew of tags. However, later in the stylesheet I apply margins and padding to specific tags. Yet for some reason Firefox isn't getting past the reset at very specific places points.
Here's an example of what's happening. Below is my reset:
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
Here is a line I added to provide style to a specific div element with class modified:
.modified { padding-top: 5px; align:center; }
In Safari, when I inspect that specific div, I see the line I created in my stylesheet and that appears to be applied.
In Firefox, when I use firebug on that same div, I see only my css reset code.
Is there a way around this? I've tried !important, as well as re-naming it div.modified instead of just modified but that hasn't worked either.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
align不是有效的 CSS 属性。我假设您正在寻找text-align: center。显然，其他东西正在影响它，因为它在我的 Firebug 中显示得非常好：
alignis not a valid CSS property. I'm assuming you were looking fortext-align: center.Obviously, something else is affecting it, as it all shows perfectly fine in my Firebug:
这确实很奇怪。没有任何理由认为 FF 应该这样做。您是否尝试过修改重置（例如，尝试添加背景：黄色；）并看看这是否会影响 FF？或者您可以尝试删除重置并查看您的 .modified 声明是否生效。只需考虑如何至少缩小问题范围 - 是重置还是第二个声明？我还要确保您的标记是有效的 - 我注意到某些浏览器比其他浏览器更能容忍格式错误的标记。
That sure is weird. There is no conceivable reason that FF should be doing that. Have you tried modifying your reset (like, try adding background:yellow;) and see if that affects FF? Or you could try removing your reset and see if your .modified declaration kicks in. Just thoughts on how to at least narrow down what is the problem - is it the reset, or the second declaration? I'd also make sure your markup is valid - I've noticed that some browsers are more forgiving for malformed markup than others.