SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    Sports Publisher mjames's Avatar
    Join Date
    Jan 2000
    Location
    Charlotte, NC
    Posts
    5,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Footer messed up in IE 7 only?

    This is my site with the problem: http://www.sports-central.org

    Scroll to the bottom for the footer area. It looks perfect in Safari and Firefox, but I loaded it on IE 7 at work and the footer is all messed up!

    I have no idea why it is doing this and my designer is MIA. I'm pissed because 40% of my audience might be seeing this messed up version.

    Any ideas or solutions would be GREATLY appreciated!

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,726
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Hi, the floats are just snagging on each other . It would be best for you to rework the HTML so that a containing element is surrounding the word on the left AND the <ul> and then float:left;clear:left that.

    Right now you could add a clearing element after each <ul> and that will force the floats to be cleared and not snag.

    Reworking the HTML to whta I proposed would be best and would remove the need of unneeded clearing elements
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  3. #3
    Sports Publisher mjames's Avatar
    Join Date
    Jan 2000
    Location
    Charlotte, NC
    Posts
    5,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, Ryan! Could you tell me exactly what I need to change to make it compatible in IE? I'm really not a tech/coder type and unfortunately, my designer is not around. I would appreciate you explaining it to me like a toddler. I can send you the actual CSS files if that would help.

  4. #4
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,726
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    After each <ul> closes add this into your code (this is the easiest, though not the best way, the best way is to rework the HTML as described above)
    Code:
    <br class="clear" />
    After each <ul> closes add that in, and now add htis CSS in
    Code:
    .clear{clear:both;height:0;font-size:0;}
    No need to send the CSS files since I can view them online
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  5. #5
    SitePoint Zealot
    Join Date
    May 2007
    Posts
    105
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Man I gave up on IE7 a long time ago. By now everyone should be using IE8.

  6. #6
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,726
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    IE6/7 probably take up near 2/5ths of the market alone..a rough estimate . IE users are very slow to upgrade. You should continue support for them.
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  7. #7
    Sports Publisher mjames's Avatar
    Join Date
    Jan 2000
    Location
    Charlotte, NC
    Posts
    5,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ryan, tried adding that code after each </ul> closes in my footer include file, and added that .clear code to the CSS file (master.css). But it still doesn't load right in IE. Can you tell me what to do now? I wasn't sure where in the CSS file to put the .clear code you gave me, so I put it in the part where some other .clearfix codes were (I also tried putting it at the bottom with the footer part). Help!

  8. #8
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,726
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    It is working, the code however isn't. If that makes sense .

    The styles aren't being applied for wahtever reason. It'd be best to fix your CSS and HTML validation errors to find out why.
    The code DOES work though. I know for a fact.
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  9. #9
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,496
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Try giving the ul in the footer a width.

    e.g.
    Code:
        #footer ul {
            float: left;
            width:525px;
            margin: 0; }
    I assume you know that IE6 is broken but I guess you aren't supporting that.

  10. #10
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,726
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Everything worked out via me and the OP through PM . Just so everyone knows, IE6 just had a double float margin bug going on and the sidebar needing to be floated instead of letting it rest against the floated sidebar.
    Always looking for web design/development work.
    http://www.CodeFundamentals.com


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
  •