Results 1 to 3 of 3

Thread: z-index not working

  1. #1
    Member trixiemay's Avatar
    Join Date
    Jan 2009
    Posts
    187

    Default z-index not working 22 Jul 2012 @ 19.36

    I can't figure out why the z-index isn't making the div float above the other divs:
    My Site

    I want the tweet div to sit to the left of the slideshow.

    Any ideas please?
      Reply With Quote

  2. #2
    Administrator Frinkky's Avatar
    Join Date
    Dec 2008
    Posts
    1,817
    Blog Entries
    1

    Default 22 Jul 2012 @ 20.08

    Z-index isn't the issue here. It's improper use of position. position:relative, by itself, does nothing other than allow you to position something (with top/right/bottom/left) relative to where it would have naturally appeared. in your case, the twitter div is the first element, so it is appearing at the top of the page.

    I gather from your post that you want it just to the left of the slideshow div. In that case, move the tweets div as child of #container. Give #container position:relative; and position:absolute; to #tweets. This means that when you set a position with top/left or top/right #tweets will move relative to #container. In this case, top should probably be 211px and either left:-389px or right:900px.

    EDIT: It seems you're fiddling around on the file you linked to so I can't be sure what you're after as now you've applied position:fixed which, as the name implies, fixes the position of an element relative to the browser window and not the document.
      Reply With Quote

  3. #3
    Member trixiemay's Avatar
    Join Date
    Jan 2009
    Posts
    187

    Default 22 Jul 2012 @ 21.37

    Sorry for fiddling Frinkky.
    Yeah. I decided I prefer the Twitter feed on the left edge away from the other content.
    I really appreciated your thorough explanation as I have struggled on other projects with z-index.
      Reply With Quote

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •