xhtml & mozilla 1.6

Shadow2531

[H]ard|Gawd
Joined
Jun 13, 2003
Messages
1,670
In Mozilla 1.6 and Firefox 0.8, when viewing one of my xhtml 1.1 pages served as application/xhtml+xml, there is a white box around the body.

This did not happen in firebird 0.7 and Mozilla 1.5.

As you will notice, I have a background pic.

For me to get rid of the white box, I have to set the background-image for the html element instead of the body.

Here's what I would have to change my css to.

html
{
background-image: url(../pics/stars.jpg);
background-repeat: repeat;
background-attachment:fixed;
background-color: #000000;
}
body
{
color: #ff0000;
font-family: serif;
background-color: transparent;
}

That works great and opera doesn't have a problem with it, but my question is, should I have to do that? Opera doesn't require me to do that.

Is it a bug in Mozilla 1.6 and Firefox 0.8 or do you think the devs made it like that to better conform to the w3c spec with the idea that in xml, the html tag is just another element that can be styled.

Thanks.

Here's the corrected version . The w3c validtor doesn't have a problem with it, but just would like some opinions or the actual link to the spec on this situation.

(keep in mind that the geocities type look of that page is done on purpose).
 
In my experience, Mozilla/Firebird/Firefox do what the W3C intends. That is to say, whatever they show you is how it's "supposed to be." At least, that's what happens 99% of the time.

Thus, if that's what you need to get it working in Mozilla, it's probably correct.

Note that I said "probably." One thing I do in my code is to explicitly set margin: 0 and padding: 0 on my body tag in CSS. Perhaps you want to try that rather than the html element "hack" you've done?
 
Yeh I can set the margins for the body. However, margin settings for the body don't affect the top and bottom whitespace in that situation.

I'm just wondering if the html deal I did is really a hack or something that I should have done in the first place.

The Mozilla 1.6 release notes say they did a lot of core work to adhere to standards more, so maybe they mae it like that on purpose.

Since there's no problem with the corrected page and it validates, I guess it's alright.

According to others in the Opera forum, if you want to set a background image of an entire page, the w3 standard says you must do it for the html element when an xhtml page is served as application/xhtml+xml.

I'm waiting for a specific link to confirm it, but it looks like my corrected page is O.K.
 
What I figured out is this:

In Mozilla with the body tags present, there's no way to get rid of the space at the top. You can set a backround image or color, but you can't put text in it unless you put the text outside of the body tags.

If you remove the body tags are just pretend that the <html> tags are the body tags, then everything looks good.

Of course without the body tags, it doesn't validate.

So maybe this is a bug in Gecko.

Another thing I tried for the non-correct version of the page I posted above is to put text inbetween </head> and <body>

If I do that, it will render in the white space up top.

Opera does not have these problems.

The problem is mozilla rendering stuff outside the body tags.
 
Here's what I have come up with.

Pertaining only to xhtml served as application/xthml+xml:

The root element is <html> and if I want to set a background for the whole page, I must set it for <html> and not <body> because in xhtml served as application/xhtml+xml, body is not the canvas; html is.

The case of the wrong sized margins on top and bottom in Mozilla 1.6 and Firefox 0.8 is a bug.

Opera is doing it wrong and should behave like Mozilla (except for the top and bottom margin bug).

So with my corrected version the bakckground is set for html and not body. In Mozilla 1.6 and Firefox 0.8, the effect of the bug (top and bottom margins) is not so easily noticed because the body has the same background as those margins (that are not supposed to be there) because the body inherits it from html.

The margin bug thing seems to be a problem with p tags. If I don't use them, then I don't have that problem. I'll be redoing that page.

Geez, I guess it's not a bug that the p tags cause the border to increase up top. (border collapse) :rolleyes:

It's solved now. I just got rid of the p tags and used all divs.

So Mozilla 1.6 and Firefox 0.8 have improved standards compliancy and it was just poor coding on my part that I previously got away with.

To help others that come across this problem, here's the

old page and here's the new page .
 
Back
Top