[thelist] CSS: Why does this work?
Tony Crockford
tonyc at boldfish.co.uk
Tue Apr 6 10:31:51 CDT 2004
At 14:28 on Tuesday, 06 Apr 2004, Rob Smith wrote:
> Good morning, afternoon, evening,
>
> <style type="text/css">
> * { font: 1em serif; }
> .a { position: absolute; z-index: 2; top: 10; left: 10; padding:
> 10px;}
> .b { z-index: 1; top: 0; left: 0; width: 100%; height: 100%;
> padding:
> 0px; margin: 0px; align:center;}
> </style>
>
> Why does the div work when you enter either "test a" or just "a" in the
> class field? As a random test, "cow a" works too.
>
because you are applying multiple classes to the div. of which one is
class "a" the other is class "test" or "cow" (which don't exist,
presumably) (e.g
http://www.interfacethis.com/misc/css-test/multiclass.html)
It's so you can have things like
<div id="a" class="notes warning">
</div> and
<div id="b" class="notes general">
</div>
so that styles in class notes are applied to both and styles in warning
and general to just one.
p.s. Looking at your style declarations suggests that perhaps you should
be using id's rather than classes?
Absolute positioning assumes only one element occupies that position?
This would look like:
<style type="text/css">
* { font: 1em serif; }
#a { position: absolute; z-index: 2; top: 10; left: 10; padding: 10px;}
#b { z-index: 1; top: 0; left: 0; width: 100%; height: 100%; padding:
0px; margin: 0px; align:center;}
</style>
with <div id="a"></div> etc
hth
More information about the thelist
mailing list