[thelist] Descendant selectors in CSS (no subject)

Lindsay Evans lindsay at redsquare.com.au
Tue Nov 6 22:14:22 CST 2001


> Can someone tell me how the styles below work?
>
> .sidebar UL {
<snip />
> Does this only work with ULs within a sidebar class?

yep

> .sidebar .container {

applies to elements with the class "container" that are descendants of
elements with the class "sidebar"

eg.

<div class="sidebar">
	<div class="container">...</div> <!-- this will have the style applied -->
	<p>...</p> <!-- this will not -->
</div>


> .sidebar .ib TABLE {

applies to all tables that are descendants of elements with the class "ib"
that are descendants of elements with the class "sidebar"

eg.

<div class="sidebar">
	<div class="ib">
		<table>...</table> <!-- this will have the style applied -->
		<p>...</p> <!-- this will not -->
		<p>
			<table>...</table> <!-- this will have the style applied too -->
		</p>
	</div>
</div>

more info on the wacky world of selectors can be found here:
http://www.w3.org/TR/CSS2/selector.html#descendant-selectors

especially interesting is the W3C's definition of 'descendant' :o)
http://www.w3.org/TR/CSS2/conform.html#x27

--
 Lindsay Evans.
 Developer,
 Red Square Productions.

 vox: 8596.4000
 fax: 8596.4001
 web: www.redsquare.com.au

> -----Original Message-----
> From: thelist-admin at lists.evolt.org
> [mailto:thelist-admin at lists.evolt.org]On Behalf Of Webmaster
> Sent: Wednesday, November 07, 2001 2:43 PM
> To: thelist at lists.evolt.org
> Subject: [thelist] (no subject)
>
>
> I sent this earlier, but didn't see it come through.

<snip />





More information about the thelist mailing list