Forums

Give help. Get help.

  • # December 23, 2008 at 12:57 pm

    Well, guys. I thought I had z-index all figured out. Apparently not. Here’s the page:

    http://stuckpixelstudio.com/clients/cro … /index.php

    This might get a little complex, so bear with me.

    Right now I’m using a jquery cycle plugin to fade between 4 different images. What I want to do is get the div id "coverback" on top of the div id "cover". You may be thinking, "But if you do that you won’t be able to see the pictures!" Yes, well I’m planning on replacing the background in "coverback" with a png with a hole in it.

    Anyway, the id’s "cover", "coverback", and the class "pics" and "pics img" all have relative positioning. "coverback" has a z-index of 10, and "cover", "pics" and "pics img" have a z-index of 5. If I understand it right, coverback should now be on top of everything with a lower z-index, correct?

    Unfortunately, that’s not what is happening. Here’s the snippet of the HTML:

    Code:



    And the CSS:

    Code:
    #coverback {background-image: url(images/slide_back.png); width:660px; height:228px; min-height:228px; margin-bottom: -50px; position:relative; left:-21px; top:-44px; z-index: 10}
    #cover {position:relative; margin-top:45px; left:10px; top:10px; z-index: 5}
    .pics { height: 210px; width: 635px; padding:0; margin:0; overflow: hidden; position: relative; z-index: 5 }
    .pics img { height: 200px; width: 625px; padding: 5px; border: 1px solid #ccc; background-color: #eee; top:0; left:0; position: relative; z-index: 5 }

    It’s these little things that make me pull my hair out.

    Thanks guys.

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag