SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Thread: Quick CSS Help

  1. #1
    SitePoint Enthusiast ghealy44's Avatar
    Join Date
    Sep 2010
    Posts
    60
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Quick CSS Help

    In IE8, im having somethign happen where the text to the right of the picture frame goes behind the picture frame. It looks fine in other browsers and IE 7, just in IE8 is it messing up.

    any ideas or suggestions?

    here is the site: www.glenhealy.com/spektor

  2. #2
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,139
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Did you try to float the featured video content as well. I see you have positioned it absolute which takes it out of the flow

  3. #3
    Ripe Tomatos silver trophybronze trophy Rayzur's Avatar
    Join Date
    Jun 2007
    Location
    Texas
    Posts
    4,174
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    The right text div is hiding behind the video div.

    It looks like IE8 does not like the float on (#main-content) the parent of the video and right text divs.

    Either remove the float or add width:100% so it does not shrinkwrap. That float will contain the child floats though if you leave it there.

    Code:
    #container #main-content {
    float:left;
    width:100%;
    min-height:500px;
    position:relative;
    }

  4. #4
    SitePoint Enthusiast ghealy44's Avatar
    Join Date
    Sep 2010
    Posts
    60
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Rayzur View Post
    The right text div is hiding behind the video div.

    It looks like IE8 does not like the float on (#main-content) the parent of the video and right text divs.

    Either remove the float or add width:100% so it does not shrinkwrap. That float will contain the child floats though if you leave it there.

    Code:
    #container #main-content {
    float:left;
    width:100%;
    min-height:500px;
    position:relative;
    }

    Made the width 100% and it worked perfectly! Thanks for the help!


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
  •