SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Zealot dereko's Avatar
    Join Date
    Dec 2003
    Location
    Ireland
    Posts
    189
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Image hanging over edge of div in IE

    I'm trying to set negative margins for div inside a different div which works fine in firefox at my first attempt.

    http://www.jeebers.com/1time/

    but when you view it in ie it shows up completely different.

    I seem to remember a way to force both browsers to work the same way but i'm not sure if that will fix my problem...


    Any ideas?

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,355
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Just add position:relative to give it a stacking context and it gets drawn on top correctly.

    Code:
    #screenshot img{
    margin-top: -9px;
    margin-left: 20px;
    position:relative;
    }

  3. #3
    SitePoint Zealot dereko's Avatar
    Join Date
    Dec 2003
    Location
    Ireland
    Posts
    189
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    nice one!

    now to figure out how to make it hang over the right edge of the div....

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,355
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    I didn't notice that

    You will need to do it like this for ie:

    Remove the left margin from the image and apply a negative margin to the float instead.

    Code:
    #screenshot {
     float: right;
     width: 463px;
    margin-right:-20px;
    }
    #screenshot img{
     margin-top: -9px;
    /*margin-left:20px;/remove this*/
    position:relative;
    }

  5. #5
    SitePoint Zealot dereko's Avatar
    Join Date
    Dec 2003
    Location
    Ireland
    Posts
    189
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thank you very much!


Bookmarks

Posting Permissions

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