From this question I started looking: Firefox screwing up headings sizes h1 h2 h3
Here is a html snippet that开发者_开发百科 will show the issue:
<html>
<head>
</head>
<body>
<section>
<section>
<h1>This is an h1</h1>
<h2>This is an h2</h2>
<h3>This is an h3</h3>
<h4>This is an h4</h4>
</section>
</section>
</body>
</html>
so save that into test.html and open it in firefox 4 and in chrome, the h1 tag shows way smaller in firefox 4.
Can anyone explain me how to fix this ?
It is possible to use <h1>
tag multiple times in the same document as part of HTML5. The <h1>
tag is specifically used as a title for a section. Apparently, FireFox implements the nested section as an indication to reduce the size of the <h1>
for the sub-section, which makes sense, while Chrome does not.
More Info
- http://brugbart.com/References/html-section-tag
- http://brokensyllabus.blogspot.com/2008/02/proper-use-of-h1-tag.html
What about using CSS to specify the size of all h1 tags? Then, it shouldn't matter whether it is within a section or anything else.
精彩评论