The W3C says:
"The 'z-index' property is used to specify the stacking order of
positionable elements <#Positionable_Elements>."
and it defines positionable elements as "Elements whose 'position'
property is set to either 'absolute' or 'relative'."
<#Positionable_Elements>
Then the z-index style should work for a relative positioned SPAN for
instance, right?
Microsoft also says:
"It is quite possible that relatively positioned elements will overlap
with other objects and elements on the page. As with absolute
positioning, you can use the z-index attribute to set the *z-index* of
the positioned element relative to other elements that might occupy the
same area."
Then, in the following code, the content of the SPAN which has a z-index
of 1 should not overlap the rest of the paragraph with a x-index of 2.
What's the problem?
<P STYLE="position:relative; z-index:2; background-color: Aqua;">This
text should not be<SPAN STYLE="position: relative; z-index:1;
left:-50px; background-color: #ECE9D8;">overlaped</SPAN></P>.
Span is an inline element. AFIAK z-index would apply only to block level
elements.
--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share
It looks like is is the problem, why don't they say so in the docs?
Thanks.
> >AFIAK z-index would apply only to block level elements.
>
> It looks like is is the problem, why don't they say so in the docs?
>
> Thanks.
>
It is not a problem, it is the nature of block level and inline elements.
Of course, one can always style a block level element to _look_ like an
inline one.
Well, for the time being, it is a problem for me ;-)
>>Of course, one can always style a block level element to _look_ like an
inline one.
In my case I would need LI elements to _look_ like block elements and give them
the z-index levels I want. I gave them display:block; to no avail: the z-index
still has no effect.
URL?
I'm trying to get item 1.1, item 1.2 and item 1.3 to overlap item 2 and 3.