SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot Timbothecat's Avatar
    Join Date
    May 2008
    Location
    Melbourne, Australia
    Posts
    108
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Question on Paul O'B's Sticky Footer...

    Hi all.

    I'm doing an assignment for TAFE at the moment, building an online shopping site with CMS using ASP.NET and I decided to go for the extra degree of difficulty (just like an idiot!) and use a sticky footer. I used the sticky footer created by Paul O'Brien, and it works a treat by the way, and what's more, it's the same across all browsers, -except IE6- great work by all involved. Now, I want to point out here that I don't give a rats a#$e about IE6. It's not a requirement for this assignment that the site look perfect in that particular dinosaur of a browser.

    My question though is this. The sticky footer has some alternate IE css rules:
    Code:
    <!--[if (lte IE 6)|(gte IE 8)]>
    	    <style type="text/css">
    		    #outer {height:100%;display:table;}
    	    </style>
        <![endif]-->
    Why does this try to give IE6 a display of table? I thought that none of the Internet Exploder's before IE8 would render display: table. So, I'm waiting anxiously for any answers that may be forthcoming.

    Have a good one.

    Tim.
    Linux Clustering: All nodes lead to /home.

  2. #2
    SitePoint Enthusiast
    Join Date
    Mar 2010
    Posts
    43
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    - IE 6 cannot use a majority of display's properties correctly. float has been known to be the workaround.

  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)
    Why does this try to give IE6 a display of table? I thought that none of the Internet Exploder's before IE8 would render display: table. So, I'm waiting anxiously for any answers that may be forthcoming.
    Hi,
    That IE CC is not trying to give IE6 display:table;
    It is giving IE6 height:100%; as a min-height workaround since IE6 treats height as min-height due to it's expanding box bug.

    IE8 gets the display:table;while IE6 ignores it.

    A complete explanation of the Modern Sticky Footer can be found at Paul's search-this.com article.
    Sticky Footers - A Sticky Subject!

    However, if you read through the comments at the end of the article you will see that we have found another way to cater to IE8 without using the display:table; That allows us to eliminate all IE CC's

    We have also eliminated the extra wrapping div that was needed for Opera and worked the IE8 fix into the pseudo:after element with height:1% to force IE8 to to reference the parent's min-height:100%;

    The updated Sticky Footer code can be seen in these examples -

    http://www.pmob.co.uk/temp/sticky-fo...w-no-table.htm
    http://www.css-lab.com/demos/stickfoot/stickfoot-1.html

    Hope that helps

  4. #4
    SitePoint Zealot Timbothecat's Avatar
    Join Date
    May 2008
    Location
    Melbourne, Australia
    Posts
    108
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Rayzur.

    That's a great explanation and makes perfect sense. I'll be reading the articles and links you've posted. I want to try and get my head around the more complex vagaries of css to help take my designs to the next level, and I'm of the opinion that I need to understand WHY these things work, and not simply muck around with something that someone else has done with no further understanding of it's working -if that makes sense.

    Anyway, thanks for your reply, it has been most helpful.

    All the best,

    Tim.
    Linux Clustering: All nodes lead to /home.


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
  •