No replies
Mantorok
Mantorok's picture
Offline
newbie
Last seen: 10 years 31 weeks ago
Joined: 2010-02-17
Posts: 1
Points: 2

Hi all

I have some nested divs that are providing corners to my unordered list, but when I set my first list item to have a background colour it overlaps the underlying divs, so what I want to do is ensure that the list item comes before the corner-divs.

The markup is:

<div id="#nav">
   <div> <!-- top right -->
      <div> <!-- bottom left -->
         <div> <!-- bottom right -->
            <ul>
               <li class="first">
                  <p>This list item overlaps the top-right/left corners because it has a background colour</P>
               </li>
            </ul>
         </div>
      </div>
   </div>
</div> 

I've tried setting z-index to all of the divs and then set the list-items z-index to 0 or -1 but it doesn't appear to be working, I'm starting to question if it's possible to use z-index in this manner.

HTMS
Thanks
Kev