Styling the root element HTML

[Thomas Mlynarczyk]

Hi,

Can I style the root element (HTML) just like any other (and will it work as
expected) or are there restrictions to take into account?

Thanks in advance,
Thomas

[Lars Eighner]

Re: Styling the root element HTML

In our last episode,
<d703es$s6l$03$ 1@news.t-online.com>,
the lovely and talented Thomas Mlynarczyk
broadcast on comp.infosystem s.www.authoring.stylesheets:
[color=blue]
> Can I style the root element (HTML) just like any other (and will it work as
> expected) or are there restrictions to take into account?[/color]

What exactly would that accomplish that styling BODY or FRAMESET
would not?

--
Lars Eighner eighner@io.com http://www.larseighner.com/
War on Terrorism: History a Mystery
"He's busy making history, but doesn't look back at his own, or the
world's.... Bush would rather look forward than backward." --_Newsweek_

[Barbara de Zoete]

Re: Styling the root element HTML

On Tue, 24 May 2005 22:37:14 +0200, Thomas Mlynarczyk
<blue_elephant5 5@hotmail.com> wrote:
[color=blue]
> Can I style the root element (HTML) just like any other (and will it work as
> expected) or are there restrictions to take into account?
>[/color]

You can style it (I did :-) ) All I encountered was that the bg-colour you set
for the html element will be the bg-colour for the browser viewport (found out
this is agreed upon behaviour). I found no other strange things.


--
,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------.
| weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html |
| webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html |
|zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html |
`-------------------------------------------------- --<--@ ------------'

[Thomas Mlynarczyk]

Re: Styling the root element HTML

Also sprach Lars Eighner:
[color=blue][color=green]
>> Can I style the root element (HTML) just like any other (and will it
>> work as expected) or are there restrictions to take into account?[/color][/color]
[color=blue]
> What exactly would that accomplish that styling BODY or FRAMESET
> would not?[/color]


I want to have a background image and in addition on the left side a graphic
(say about 200px wide) as background for the menu. Both should stretch to
the full height of the viewport (even when the latter is being resized) or
the height of the document - whichever is greater. I can do the left side
graphic by assigning it as background image to the body with repeat-y. But
then the rest of the space could only be a single color (body's background
color) or I'd have to wrap the main background image in a div, but then it
would stretch only as far as the content goes. So I thought assigning the
main background image to the html element instead would solve the problem in
an elegant way.

[Thomas Mlynarczyk]

Re: Styling the root element HTML

Also sprach Barbara de Zoete:

[color=blue][color=green]
>> Can I style the root element[/color][/color]
[color=blue]
> You can style it (I did :-) ) All I encountered was that the
> bg-colour you set for the html element will be the bg-colour for the
> browser viewport (found out this is agreed upon behaviour).[/color]

Meaning that if I scroll or resize the viewport, I will "see the end" of the
background? I'd like to give HTML a background-image (and, for "imageless"
clients, a background-color as well) and expect it to behave as if it was
assigned to BODY instead, so I could assign two overlapping background
images (the one for the body "clipped" by "repeat-y").

[Spartanicus]

Re: Styling the root element HTML

"Thomas Mlynarczyk" <blue_elephant5 5@hotmail.com> wrote:
[color=blue]
>Can I style the root element (HTML) just like any other (and will it work as
>expected) or are there restrictions to take into account?[/color]

For documents served as text/html (including "xhtml" served as
text/html) it is recommended to style the body element, not the html
element. http://www.w3.org/TR/CSS21/colors.html#q2

--
Spartanicus

[Harlan Messinger]

Re: Styling the root element HTML

Lars Eighner wrote:[color=blue]
> In our last episode,
> <d703es$s6l$03$ 1@news.t-online.com>,
> the lovely and talented Thomas Mlynarczyk
> broadcast on comp.infosystem s.www.authoring.stylesheets:
>[color=green]
>>Can I style the root element (HTML) just like any other (and will it work as
>>expected) or are there restrictions to take into account?[/color]
>
> What exactly would that accomplish that styling BODY or FRAMESET
> would not?
>[/color]

http://groups-beta.google.com/group/comp.infosystems.www.authoring.stylesheets/browse_frm/thread/5623f732af2ad0e1/f3344178669c4033?q=messinger+html+body+red+background-color&rnum=2&hl=en#f3344178669c4033

(http://tinylink.com/?hwDO8Ui7T7)

[Thomas Mlynarczyk]

Re: Styling the root element HTML

Also sprach Harlan Messinger:
[color=blue]
>[/color]

http://groups-beta.google.com/group/comp.infosystems.www.authoring.styleshee

ts/browse_frm/thread/5623f732af2ad0e 1/f3344178669c403 3?q=messinger+h tml+body
+red+background-color&rnum=2&hl =en#f3344178669 c4033

I don't quite see the point. The code example produces a red canvas, as
expected. But as I precised, I want to do this:

html { background: #abc url(canvasbackg round.jpg); }
body { background: url(leftsidebac kground.jpg) repeat-y; } /* picture is
200px wide */

[Thomas Mlynarczyk]

Re: Styling the root element HTML

Also sprach Spartanicus:
[color=blue]
> For documents served as text/html (including "xhtml" served as
> text/html) it is recommended to style the body element, not the html
> element. http://www.w3.org/TR/CSS21/colors.html#q2[/color]

In other words: to be on the safe side, I'd better not? :-(

[Harlan Messinger]

Re: Styling the root element HTML

Thomas Mlynarczyk wrote:[color=blue]
> Also sprach Harlan Messinger:
>
>
> http://groups-beta.google.com/group/...ring.styleshee
> ts/browse_frm/thread/5623f732af2ad0e 1/f3344178669c403 3?q=messinger+h tml+body
> +red+background-color&rnum=2&hl =en#f3344178669 c4033
>
> I don't quite see the point. The code example produces a red canvas, as
> expected.[/color]

In IE or Firefox it produces a green canvas with the body's background
appearing in red against it.

But as I precised, I want to do this:[color=blue]
>
> html { background: #abc url(canvasbackg round.jpg); }
> body { background: url(leftsidebac kground.jpg) repeat-y; } /* picture is
> 200px wide */[/color]

That should work like my example, with the addition of the background
images. Nothing wrong with it.

[Christoph Päper]

Re: Styling the root element HTML

Thomas Mlynarczyk schrieb:[color=blue]
>
> Can I style the root element (HTML) just like any other[/color]

Yes.
[color=blue]
> (and will it work as expected)[/color]

No, not always.