1

I was trying to refer to the root element w/o using the :root . I am trying that for an old version of browser (IE8).

I just can't find anything. How could anyone refer to the root element before CSS3 ??

Thanks in advance.

BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
NickPro
  • 304
  • 3
  • 14
  • lets say i have this code : :root { background-color: #6374AB; } – NickPro May 21 '11 at 18:34
  • i am not looking for just alternative ways to change the bgcolor of my page, i have to do it by refering to the root element with another way. – NickPro May 21 '11 at 18:34

2 Answers2

4

The root element is always html in HTML and XHTML web documents. So just use

html
{
some style;
}

I am assuming ofcourse that by "refer" you meant "selector" in CSS!

reference

This pseudo-class matches an element that’s the root element of the document. In HTML documents, this selector matches the html element.

Jawad
  • 8,352
  • 10
  • 40
  • 45
  • Yes, the pseudo-class is typically used when using CSS rather than XSL to style an XML document. – BoltClock May 21 '11 at 18:36
  • i know, but i have to do this supposing i dont know that html's root element is always "html".. Yes i mean a selector .. :) – NickPro May 21 '11 at 18:36
  • 2
    @kit-kat: Besides the excellent SitePoint Reference, this is also in the official [CSS3 selector spec](http://www.w3.org/TR/css3-selectors/#root-pseudo). So you can safely assume the root element is always `html`, now that it's been mentioned for your knowledge. – BoltClock May 21 '11 at 18:38
  • You dont need to know. The user agent/browser will always know that the "html" is the root element. So even if you dont know (?) or you want to suppose that you dont know! and want a CSS selector to always target the root element, html will always work. – Jawad May 21 '11 at 18:43
  • @BoltClock: I know this about html. The point is that i have to do it supposing that : i) i have to ignore that html has only one root element ii) i must not use the :root pseudo class. I know it sounds silly, but you should also say it to my professor... :( – NickPro May 21 '11 at 18:45
  • @JAA149: lets say that i may want to use any xml language. – NickPro May 21 '11 at 18:46
  • I am not sure what you want. I think you want something else but are unable to explain clearly. As you said "i)i have to ignore that html has only one root element". html does not have one root element. The web document has one root element even in XML. html is the parent/ancestor of all other elements in html & xhtml web documents, of the head and body. An XML document must always have one root element, which can be any.Do you want a CSS selector that matches the top most parent/ancestor? – Jawad May 21 '11 at 18:49
  • And if the answer to the last question in JAA149's comment is yes for any kind of SGML/XML document, then `:root` is the **only** possible way to do it. – BoltClock May 21 '11 at 18:55
  • well i will try to make it clearer.. I want to have a CSS selector for an XML sheet. But: 1) i don't know which is the root element of my sheet 2) i must not use the :root class. In other words i want to refer to an element without parent, or i just want to substitute the :root class with something functional. In fact, i want a general purpose way to do this, independent of languages and knowledge of the xml sheet. – NickPro May 21 '11 at 18:55
  • http://stackoverflow.com/questions/368668/how-to-get-tag-name-of-root-element-in-an-xml-document-w-xslt – Jawad May 21 '11 at 19:08
  • @JAA149: That is XSL/XSLT, not CSS. – BoltClock May 21 '11 at 19:09
  • Yeah I know mate. Just trying to get into his head! – Jawad May 21 '11 at 19:11
  • @bolt not always in IE6 for example there's an element above `html` – Knu May 21 '11 at 20:04
1

For HTML/XHTML documents, as JAA149 says just select the html element since it's guaranteed to be the root element (even for documents that omit the tags in their markup).

For arbitrary XML documents where the name of the root element may not be known, there is no other way in CSS than with the CSS3 :root pseudo-class — this is precisely why it was introduced. If you can, use XSL/XSLT instead, with the XPath expression /* to select the root element.

BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
  • i am going to accept the answer html {...} .... even though it might not be enough for me, it is a completely correct answer.. also yours.. – NickPro May 22 '11 at 23:38