body { font-size: ; font-family: }
| Code: |
| html:lang(en)>head+body p[id="BrowserWarning"] {display:none} |
Tommy has left the building
Share: 
| m80her wrote: |
| The line of code is:
body { font-family: verdana; font-size: 10px; color: black; background-color: #6BC3E7; } The text displays in Verdana, but no matter what size variable I enter, it stays on 12px... Rich |
Just had a thought. When I use this line in CSS I enter
| Quote: |
| html body {font-family: verdana, arial, sans-serif; ///} |
Mike Abbott
Accessible to everyone
Share:
It's not necessary to include 'html' in that selector, since 'body' is always a descendant of 'html' and nothing else. You may think of
| Code: |
| html, body {font-family:...} |
but that's not necessary either, since all other elements are descendants of 'body'.
Rules for both 'html' and 'body' are usually stuff like margins and colors, since some browsers consider 'html' to be the root element, while others think it's 'body'.
Tommy has left the building
Share:
Thank youMike Abbott
Accessible to everyone
Share:
Tommy
html:lang(en)>head+body p[id="BrowserWarning"] {display:none}
I think you're being a bad man! But could you explain to everyone what these CSS selectors are doing?
Stuff I do
******************************
Design: http://www.stuffandnonsense.co.uk
My book: http://www.transcendingcss.com/
Share:
I'm not being bad ... I'm just promoting Good Browsers.
html:lang(en) selects a <html> element which has either lang="en" or xml:lang="en" specified. (And we always identify the primary natural language of our documents, don't we?
)
>head selects a <head> element that is an immediate child of <html>. That is usually the case ...
+body selects a <body> element that is a sibling of the <head>. Anything else is highly irregular.
So, so far we've basically just selected the one and only <body> element, but we've done it in a way that very few browers actually recognize. Mozilla does, but Opera 7.23 does not (fails on the :lang selector). I don't know about Mac browsers like Safari.
p[id="BrowserWarning"] is just a fancy way of saying p#BrowserWarning, but it won't be recognized by the really lousy browsers out there.
Guess how much of this Bill Gates's favorite browser supports ...
Tommy has left the building
Share:
Re: html:lang(en)>head+body p[id="BrowserWarning"] {display:none}
TOOLman,
Reading the CSS standard, I'm a bit uncertain about the "more specific" rules, but should this work?
| Code: |
| p#GoodBrowser {display:none}
html:lang(en)>head+body p[id="GoodBrowser"] {display:block} <p id="GoodBrowser">You really <em>are </em> lucky to have such a browser!</p> |
Share:
| The Bead Man wrote: | ||
| Re: html:lang(en)>head+body p[id="BrowserWarning"] {display:none}
TOOLman, Reading the CSS standard, I'm a bit uncertain about the "more specific" rules, but should this work?
|
i don't see why not (but i only had a cursory glance at this whole thread just now, so it's likely i'm missing something)
Patrick H. Lauke / webmaster / University of Salford
co-lead: WaSP Accesibility Task Force
take it to the streets ... WaSP Street Team
personal: splintered | photographia | redux
co-author: Web Accessibility - Web Standards and Regulatory Compliance
Share:
It would work, but not quite the way you intended. That <p> would be visible in a browser with no CSS support whatsoever! 
It would only hide the paragraph from browsers with some, but not excellent, CSS support (IE, Opera, etc.)
I don't think it would work in NN4, because IIRC, it doesn't understand an element name followed by an ID. If you specify the first rule as
| Code: |
| #GoodBrowser {display:none} |
you might make it work in NN4 as well, provided the second rule doesn't make it crash.
This technique only works as 'display for bad browsers, hide for good ones,' not the other way around. For that, you could do something like this:
| Code: |
|
html:lang(en)>head+body div[id="GoodBrowser"]:after {content: "You really ARE lucky to have such a browser!"} <div id="GoodBrowser"></div> |
A 'bad' browser would just see an empty div, which will basically cause a line break in the code. A good browser will insert the text, but you won't be able to mark up anything inside it, like with the <em>.
Tommy has left the building
Share: