<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta http-equiv=Content-Type content="text/html; charset=us-ascii">
<meta name=Generator content="Microsoft Word 12 (filtered medium)">
<style>
<!--
/* Font Definitions */
@font-face
{font-family:"Cambria Math";
panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
{font-family:Calibri;
panose-1:2 15 5 2 2 2 4 3 2 4;}
@font-face
{font-family:Tahoma;
panose-1:2 11 6 4 3 5 4 4 2 4;}
@font-face
{font-family:Verdana;
panose-1:2 11 6 4 3 5 4 4 2 4;}
@font-face
{font-family:Georgia;
panose-1:2 4 5 2 5 4 5 2 3 3;}
@font-face
{font-family:"Lucida Console";
panose-1:2 11 6 9 4 5 4 2 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:"Calibri","sans-serif";}
a:link, span.MsoHyperlink
{mso-style-priority:99;
color:blue;
text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
{mso-style-priority:99;
color:purple;
text-decoration:underline;}
span.EmailStyle17
{mso-style-type:personal;
font-family:"Calibri","sans-serif";
color:windowtext;}
span.EmailStyle18
{mso-style-type:personal-reply;
font-family:"Calibri","sans-serif";
color:#1F497D;}
span.apple-style-span
{mso-style-name:apple-style-span;}
.MsoChpDefault
{mso-style-type:export-only;
font-size:10.0pt;}
@page Section1
{size:8.5in 11.0in;
margin:1.0in 1.0in 1.0in 1.0in;}
div.Section1
{page:Section1;}
-->
</style>
<!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]-->
</head>
<body lang=EN-US link=blue vlink=purple>
<div class=Section1>
<p class=MsoNormal><span style='color:#1F497D'>I *<b>believe</b>* I figured it
out…<br>
The sticky footer site says to use padding to increase vertical height: </span><span
class=apple-style-span><i><span style='font-size:11.5pt;font-family:"Georgia","serif";
color:#444444'>“Instead use padding to create spacing inside the element.”</span></i></span><span
style='color:#1F497D'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#1F497D'><o:p> </o:p></span></p>
<p class=MsoNormal><span style='color:#1F497D'> I was using <o:p></o:p></span></p>
<p class=MsoNormal><span style='font-family:"Lucida Console";color:black'>padding:
1em 0 1em 0; <o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#1F497D'> to create some vertical
spacing in the navigation div. I guess IE7 was allergic to that…. <o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#1F497D'><o:p> </o:p></span></p>
<p class=MsoNormal><span style='color:#1F497D'>LOL, since I apparently can’t
use vertical margins <i>OR</i> padding with the sticky footer, hopefully to
keep IE7 happy I don’t have to resort to an oldschool “spacer.gif”….
X-(<o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#1F497D'><o:p> </o:p></span></p>
<p class=MsoNormal><span style='color:#1F497D'><o:p> </o:p></span></p>
<p class=MsoNormal>---<span style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><b><span style='color:#404040'>brendan, fresh-off.com</span></b><span
style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#404040'>Creative Direction &
Consultation: Web | Print | Brand</span><span style='font-size:10.0pt;
font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#404040'> </span><span
style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#404040'><a href="http://fresh-off.com">http://fresh-off.com</a></span><span
style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#404040'><a
href="mailto:hello@fresh-off.com">hello@fresh-off.com</a></span><span
style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#404040'>206.328.1067</span><span
style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#1F497D'><br>
<br>
<o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#1F497D'><o:p> </o:p></span></p>
<div>
<div style='border:none;border-top:solid #B5C4DF 1.0pt;padding:3.0pt 0in 0in 0in'>
<p class=MsoNormal><b><span style='font-size:10.0pt;font-family:"Tahoma","sans-serif"'>From:</span></b><span
style='font-size:10.0pt;font-family:"Tahoma","sans-serif"'>
themes-bounces@drupal.org [mailto:themes-bounces@drupal.org] <b>On Behalf Of </b>brendan,
fresh-off.com<br>
<b>Sent:</b> Monday, March 01, 2010 5:44 PM<br>
<b>To:</b> 'A list for theme developers'<br>
<b>Subject:</b> [themes] IE7 + sticky footer + Navigation = problems<o:p></o:p></span></p>
</div>
</div>
<p class=MsoNormal><o:p> </o:p></p>
<p class=MsoNormal><b>Hello Themers,</b><br>
Here’s one for any of you IE sleuths…<br>
I’m working out the basic html for a new theme and attempting to use
Sticky Footer ( <a href="http://www.cssstickyfooter.com/">http://www.cssstickyfooter.com/</a>
) . Except for IE7, I’ve got it working in all my test browsers
(FF, Opera, Chrome, Safari, IE8.. <i>I’m <u>not</u> supporting IE6</i>).
<o:p></o:p></p>
<p class=MsoNormal><o:p> </o:p></p>
<p class=MsoNormal><b>Here’s what happens in IE7:<o:p></o:p></b></p>
<p class=MsoNormal>First off, the IE7 problem only happens on long pages
where the content extends below the viewport. <o:p></o:p></p>
<p class=MsoNormal><o:p> </o:p></p>
<p class=MsoNormal>When the page is first loaded, the footer appears normally
at the bottom of the sites content. However, as soon as you mouse over
any of the navigation links in the navigation div (#navigation-div), the
footer jumps “up” to the bottom of the browser window and covers
the content. <o:p></o:p></p>
<p class=MsoNormal><o:p> </o:p></p>
<p class=MsoNormal>It then stays in the same position if you scroll up or down
the page.<o:p></o:p></p>
<p class=MsoNormal><o:p> </o:p></p>
<p class=MsoNormal>Here’s two pages where the footer jumps when I view it
in IE7 with my screen size set to 1440x900 : <o:p></o:p></p>
<p class=MsoNormal><o:p> </o:p></p>
<p class=MsoNormal><a href="http://alpha.fresh-off.com/blog">http://alpha.fresh-off.com/blog</a><o:p></o:p></p>
<p class=MsoNormal><a href="http://alpha.fresh-off.com/contact">http://alpha.fresh-off.com/contact</a><o:p></o:p></p>
<p class=MsoNormal><o:p> </o:p></p>
<p class=MsoNormal><o:p> </o:p></p>
<p class=MsoNormal>Any ideas on how to fix this, or what’s going on?<o:p></o:p></p>
<p class=MsoNormal><o:p> </o:p></p>
<p class=MsoNormal><br>
---<span style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><b><span style='color:#404040'>brendan, fresh-off.com</span></b><span
style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#404040'>Creative Direction &
Consultation: Web | Print | Brand</span><span style='font-size:10.0pt;
font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#404040'> </span><span
style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#404040'><a href="http://fresh-off.com">http://fresh-off.com</a></span><span
style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#404040'><a
href="mailto:hello@fresh-off.com">hello@fresh-off.com</a></span><span
style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><span style='color:#404040'>206.328.1067</span><span
style='font-size:10.0pt;font-family:"Verdana","sans-serif"'><o:p></o:p></span></p>
<p class=MsoNormal><o:p> </o:p></p>
</div>
</body>
</html>