SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Addict
    Join Date
    Oct 2009
    Location
    London, UK
    Posts
    382
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Question IE7 Layout issue

    Hi there,

    I'm generally a PHP developer, and some of the IE7 CSS hacks and tricks are a bit lost on me...

    Happily my site looks fine in IE8, 9 and the more compliant browsers (Safari, FF, Chrome), and even in IE7 it's looking pretty good, except when I add a product to the basket. The layout of the basket is off in IE7. It's not a major issue, but the client is in the public sector, so IE7 needs to be taken into account.

    Does anyone have any ideas how to bring it back into line?

    The site is here:
    www.languageforlearning.co.uk

    Here's the page that features the basket:
    http://www.languageforlearning.co.uk...Books-and-DVDs

    Here's a screenshot:
    screenshot.jpg

    Hopefully you can see that the margin of the basket on the right hand side is too big, and is pushing everything out. I think its got something to do with the form which seems to be too wide. Have no idea why. Adding the css rule width:auto; does nothing.

    Thanks in advance for your help.

    Mike

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,797
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Hi,

    Remove the float:left from the element.

    e.g.
    Code:
    div#basket .not_enough {
        clear: both;
       /* float: left; remove */
        text-align: center;
        width: 230px;
    }
    Only float elements that need to be floated as older IE can get confused when everything is floated.

  3. #3
    SitePoint Addict
    Join Date
    Oct 2009
    Location
    London, UK
    Posts
    382
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Hey Paul,

    Thanks for your help. It's looking a lot better. There's still an issue with the width of the basket. It's too wide. There seems to be an extra 10px margin on the right of the table, but according to the developer tools on IE7 there's nothing added.

    I'm at a loss.

    Thanks again,
    Mike

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,797
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Try giving a width to #basket of 250px and wrapping the inputs in spans to avoid this bug.

  5. #5
    SitePoint Addict
    Join Date
    Oct 2009
    Location
    London, UK
    Posts
    382
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Nice.

    Thank you!

    Mike


Tags for this Thread

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
  •