SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot
    Join Date
    Dec 2005
    Posts
    129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE6 not rendering CSS

    I just set up a demo page at http://www.dev411.com/typothemes to preview Typo blog themes. It works great in Firefox. Unfortunately, IE6 doesn't reliably render the text above the images. Sometimes I have to move the scroll bar up and down (so the unrendered part leaves the visible window and comes back) or drag my mouse over the text to get it to render. The CSS is very simple http://www.dev411.com/typothemes/theme.css.

    I mentioned this problem in the #rubyonrails IRC channel and someone mentioned they had to revert back to tables-based layout to get around this IE issue. Is there a way this can be solved without tables?
    Last edited by Mazr; Jun 21, 2006 at 12:33.

  2. #2
    Pedantic Semantic blain's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    528
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have checked in IE6 on XP Pro, with no problems.
    Technology is dominated by two types of people:
    those who understand what they do not manage,
    and those who manage what they do not understand.

  3. #3
    SitePoint Enthusiast
    Join Date
    Jan 2004
    Location
    USA
    Posts
    82
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ah, I've had this problem before. Usually if you specify the 'background-color' again for the problem div, and 'color' for the text then IE should render it. Setting 'width: 100%' is also worth a shot.

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,556
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    I mentioned this problem in the #rubyonrails IRC channel and someone mentioned they had to revert back to tables-based layout to get around this IE issue
    That's your first mistake You should ask people who know what they are talking about

    This is the most common ie issue and is based on the element not having "layout". read the faq on "haslayout" as this is the most important issue for anyone using css in IE and should be the first thing you learn as it will save you pulling your hair out.

    Compressedair hinted at the solution which is to supply a dimension to the element in question which forces layout.
    Code:
    #main{width:100%}
    Usually you would apply the height:1% hack if margins and padding were involved because 100% would then be too wide.

    You may have issues with your div#overview also because that lacks layout but I should try the above fix first as you don't need to apply "layout" to everything. Once an element has layout then it takes care of its boundaries much more carefully and will render its children correctly.


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
  •