css not applied to <header> element properly




7 years ago
7 years ago


(Reporter: Zhehao Mao, Unassigned)


Firefox Tracking Flags

(Not tracked)





7 years ago
User-Agent:       Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; en-US; rv: Gecko/20100401 Firefox/3.6.3
Build Identifier: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; en-US; rv: Gecko/20100401 Firefox/3.6.3

On my personal webpage I am using the new HTML5 <header> element to display the website title. I give the element a blue background, but the color is not painted across the entire element. Instead, it only paints the a small area on the left side. The page renders correctly on both Safari and Google Chrome. I have reproduced this bug on Firefox builds on both my own Linux computer and a Macintosh computer in one of my University's computer labs. When I use a <div> element instead of a <header> element in my HTML, the css is applied correctly. 

Reproducible: Always

Steps to Reproduce:
1. Go to http://zhehaomao.com in Google Chrome or Safari, notice how the <header> element at the top is painted blue across the entire screen.
2. Go to http://zhehaomao.com in Firefox, note how the <header> element is only painted in a small sliver on the left.
3. Scrape the HTML and CSS from the site. Change the <header> element to a <div> element. Notice how now the CSS is applied correctly.


7 years ago
OS: Mac OS X → Linux
Hardware: x86 → x86_64

Comment 1

7 years ago
This WFM on Mozilla/5.0 (Windows NT 5.1; rv:2.0b12pre) Gecko/20110219 Firefox/4.0b12pre

Note the HTML5 parsing engine is only turned on in Firefox 4.
If someone confirms as WFM on linux we can resolve this.
WFM, Mozilla/5.0 (X11; Linux x86_64; rv:2.0b12pre) Gecko/20110218 Firefox/4.0b12pre
Last Resolved: 7 years ago
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.