Re: [css-d] Double-star selector, layout question:
Micky Hulse wrote:
.col * { margin-left: 15px; margin-right: 15px; }
.col * * { margin: 0; }
The first rule (.col *) applies to any descendant element of an element
of class col. The second rule(.col * *) applies to any descendant
element of any descendant element of an element of class col.
Clear? Thought not :-)
It's probably easier to look at some markup:
div class=col
pThis paragraph will have 15px left and right margins/p
divThis div will also have 15px left and right margins
divbut this one will have 0 margins/div
formAnd this form will have zero margins
pAs will this paragraph/p
/form
/div
/div
It could be done using child selectors rather than descendant selectors:
.col* { margin-left: 15px; margin-right: 15px; }
but they aren't supported by IE 6 down, so this provides a workaround.
HTH,
Nick.
--
Nick Fitzsimons
http://www.nickfitz.co.uk/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Double-star selector, layout question:
http://www.ambiguism.com/test/index2.html
I mainly curious as to how the blow universal selector(s) affect elements
on the page:
.col * { margin-left: 15px; margin-right: 15px; }
.col * * { margin: 0; }
The * is a universal selector - it selects everything.
In the first case it adds a 15px margin to all childs of the .col. In your
case that would be the p's within div class=col.
The second one sets margins to 0 of any grandchilds of .col, say if you
where to embed a img or a span within the p, those wouldn't have
margins.
I'm not sure how useful this last one is though, I prefer setting a
* { margin: 0; padding: 0; }
and then spesify anything and everything myself, mainly because different
user agents have inconsistant default paddings and margins.
However, the .col * {margin: 'x'} instead of using the seemingly equal .col
{padding: 'x'} is a good idea for avoiding problems with certain old
browsers, although I haven't tested this myself.
Eystein
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Double-star selector, layout question:
@Nick and Eystein: Right on! Thanks to both of you for your great explanations! It makes perfect sense now. :D I really appreciate your help. Have a great day. Cheers, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
