25px gap at the bottom of Sticky Footer

Hey guys, could someone please help me get rid of the 25px gap at the bottom of my sticky footer?
here's the site:
http://tylertx.businesscatalyst.com/
I'm using a version of http://www.cssstickyfooter.com
If you have any ideas i would love to hear them.

Thank you so much. This was driving me nuts and i looked through all the css and html a million times.
This is a trial site right now and it looks like Business Catalyst sneaks that in after you upload it to the server. That's why I couldn't find it. Didn't think to look at it from the browser. a
I guess once I launch the site adobe will remove it.
thanks again for your help.

Similar Messages

Gap at the bottom of the page (IE7 & IE9)

Hello,
I'm having problems removing the gap at the bottom of my page. The gap only appears when viewed via IE7 and EI9.
http://www.soulstarevents.co.uk/be_an_exhibitor.html
Many thank in advance for any help.

Hello Gramps,
Thank you so much for your help with this issue. When I first added the code as you had suggested I was previewing the page in the browser labs, which was still showing the gap at the bottom of the page in both IE7 and 9. I have only IE8 on my system, which has always shown no gap, so I telephoned a friend to view the live page and the gap has now gone.
Once again many thanks for your help.

Why does the Safari window sometimes open with a 1/4 inch gap along the bottom when the desktop shows through?

I am using a 15 inch Macbook Pro i7 2.66 GHZ. 8 GB ram. 500 GB hard drive. OS 10.6.8. All updates are done on a regular basis.
Sometimes when I open Safari the window leaves a small 1/4 inch gap along the bottom. In this gap you can see the desktop. This is instead of the Safari window taking up the entire screen. When you click on the green button on the top left then it will open in the entire screen and the 1/4 inch gap is gone. This does not happen all the time but is annoying and I don't feel it should be happening. Does anyone know the solution so this stops happening and has anyone else ran into this?

it's the space for your dock. if your mouse enters that area, the dock will appear. if the window just went to the bottom, it would always initiate the dock whenever you had your mouse at the bottom of the conent window. This is un intuitive and I'm sure apple did this so you wouldn't initiate the dock.
This has become more intuitive in Lion and the dock pops up when you're at the absolute bottom of the page. which is what Sig and myself are both using.
I've also noticed it will adjust the window to the content. are the pages you're going to small in content and therefore wouldn't stretch all the way to the bottom of your screen? like a login page or a splash page? I have notice maximize will adjust the width of the window to ASC even after I had it taking up the whole screen before toggling the green button. Hope this helps!

Gap on the bottom side of the phone n95

there is a gap on the bottom side of the phone and its big can nokia care fix it

lol don't ask us mate, this is a user to user forum, we don't actually have any direct contact with Nokia representatives, and certainly not Nokia Care. all you can do is telephone your local Nokia Care Centre and ask them if they can repair it for you.
please throw some kudos our way, it would mean a lot to us
If you found this or someone's comments helpful or like what that person has to say, please give some Kudos to their post!

The left hinge has an odd gap and the bottom case has clicking noise.

I just noticed that my 19-day-old macbook pro has an uneven hinge gap.
And the bottom case has squeaky noise when I lifting the macbook pro with one hand;
as well as when I pressing lightly where the spots near the batteries that under the trackpad.
Should I go to retail store to get repair or do something?

Please make a Genius Appointment and take it in for service.

A Small Gap between the bottom of dispaly and the panel

Hai everybody,
It's been almost a week since i purchased the z1.As far i see it, its a good all rounder.
today i noticed that there is a small gap between the Display and the metal frame on the lower bottom (Front of phone) .
And dust also is gettin acumulated inside it , i wanna know if this is a manufacturing defect or is it provided to gve sm kinda shock resistance on impact while falling..
I have noticed some other Z1s also with sme kind of gaps.
It will be helpfull if somebody has noticed this, wanna know if this is a manufacturing fault or not !!
Peace out

Hai there , jus came back from sony service center. They said the gap is not a manufacturing fault, all z1s have a small gap of 0.05mm yo 0.025mm, the gap is provided to help service personals to remove the panel (using tools) in case of any fault .
Peace out

My screen display has a huge gap on the bottom

My Mac book Pro is not displaying the screen properly. There is a huge gap, about 2 1/2" on the bottom of the screen. I know I can open full screen but I don't want to have to do that. It should open like it did before. I recnetly was at the Apple store, open training session and the Apple employee was helping me with a movie. He kept adjusting the format of the movie. Since that day, my screen is not opening properly. Can someone help me fix this?
Thanks,
Karen

Try going to System Preferences/Display and see what the setting is. Set it to 1024x728 (stretched) and see what happens.

Footer to be fixed at the bottom of the page

Hi,
I have a requirement to fix the footer at the bottom of the page for various Zoom level, but at present my footer when i zoomout it moves up and leaves an empty gap at the bottom of the page.
My footer is designed using panelBorderLayout

Bump
Still having this issue and haven't been able to find a way around it, any help would be appreciated.

How can I get Firefox to fill my screen? There are gaps in the top and bottom of my screen, thanks.

I dropped my laptop recently and messed up the hard drive so after installing new hard drive I reloaded win 7 and Mozilla Firefox. When Firefox loads up there is a 1" plus gap on the top and a half inch gap at the bottom of all pages. How can I get the browser to fill the screen? Thanks.

This website is using autocomplete=off to prevent Firefox from saving and filling the name and password.
You can remove autocomplete=off with a bookmarklet to make Firefox save names and passwords and other form data.
*http://kb.mozillazine.org/User_name_and_password_not_remembered

Problems creating a sticky footer

Hi,
I'm trying to create a website in Dreamweaver using a template that I purchased but I am having problems fixing a footer to the bottom of the page,
At the moment the content footer that I have created (which is a table) changes positon from page to page depending on the content.
The template comes with 2 x CSS style sheets and 1 x JS coded page which I know I need to amend in order for the footer to remain fixed to the bottom of each page.
The trouble is my CSS and JS are not up to much. I have inserted the code from the HTML, CSS & JS below.
If anyone can help me out it would be fantastic as I'm really at a loss!
The HTML of my main webpage is as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<link href="style.css" rel="stylesheet" type="text/css" />
<link href="layout.css" rel="stylesheet" type="text/css" />
<script src="maxheight.js" type="text/javascript"></script>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<script type="text/javascript">
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
</script>
</head>
<body id="page1" onload="new ElementMaxHeight(); ;MM_preloadImages('images/facebook2.gif','images/linkedin2.gif','images/twitter2.gif')">
<div id="header">
    <div class="main">
     <div class="flash">
       <object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="980" height="137">
         <param name="movie" value="flash/menu_v8.swf" />
         <param name="quality" value="high" />
         <param name="wmode" value="transparent" />
         <param name="swfversion" value="8.0.35.0" />
         
         <param name="expressinstall" value="Scripts/expressInstall.swf" />
         
         
         <object type="application/x-shockwave-flash" data="flash/menu_v8.swf" width="980" height="137">
           
           <param name="quality" value="high" />
           <param name="wmode" value="transparent" />
           <param name="swfversion" value="8.0.35.0" />
           <param name="expressinstall" value="Scripts/expressInstall.swf" />
           
           <div>
             <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
             <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" id="Image2" /></a></p>
           </div>
           
         </object>
         
       </object>
     </div>
       <div class="flash1">
         <object id="FlashID2" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="587" height="389">
           <param name="movie" value="flash/header_v8.swf" />
           <param name="quality" value="high" />
           <param name="wmode" value="transparent" />
           <param name="swfversion" value="8.0.35.0" />
           
           <param name="expressinstall" value="Scripts/expressInstall.swf" />
           
           
           <object type="application/x-shockwave-flash" data="flash/header_v8.swf" width="587" height="389">
             
             <param name="quality" value="high" />
             <param name="wmode" value="transparent" />
             <param name="swfversion" value="8.0.35.0" />
             <param name="expressinstall" value="Scripts/expressInstall.swf" />
             
             <div>
               <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
               <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" id="Image3" /></a></p>
             </div>
             
           </object>
           
         </object>
       </div>
        <div class="indent1">
         <div class="container1">
           <p>Welcome to ACL International.<br />
                 Through our offices in the UK and Portugal we supply the<br />
                 very latest in energy saving technologies with our main<br />
                 focus being on lighting. ACL have been active in the lighting<br />
              industry for over 10 years and have built up strong relationships with some of the world's leading lighting manufacturers.</p>
           <p> </p>
           <p>Welcome to ACL International.<br />
Through our offices in the UK and Portugal we supply the<br />
very latest in energy saving technologies with our main<br />
focus being on lighting. ACL have been active in the lighting<br />
industry for over 10 years and have built up strong relationships with some of the world's leading lighting manufacturers.</p>
          </div>
      </div>
    </div>
</div>
<div id="content">
    <div class="main">
        <div class="indent-main">
            <div class="container bg">
                <div class="container bg1">
                    <div class="container bg2">
                        <div class="col-1 bg-1">
                         <div class="indent-col">
                             <img alt="" src="images/1page_title1.gif" class="title" /><br />
                                <p>An easy and affordable<br />
                              way to change existing<br />
                              lighting to an energy<br />
                              saving alternative...</p>
                                <div class="container"><a href="#" class="link-1"><em><b>read more</b></em></a></div>
                            </div>
                        </div>
                        <div class="col-1 bg-2">
                         <div class="indent-col">
                             <img alt="" src="images/1page_title2.gif" class="title" /><br />
                                <p>A more natural,<br />
                                environmentally<br />
                                friendly light<br />
                                source... </p>
                                <div class="container"><a href="#" class="link-1"><em><b>read more</b></em></a></div>
                            </div>
                        </div>
                        <div class="col-1 bg-3">
                         <div class="indent-col">
                             <img alt="" src="images/1page_title3.gif" class="title" /><br />
                                <p>Up to 80% energy <br />
                              saving with an<br />
                              extremely long<br />
                              lifetime... </p>
                                <div class="container"><a href="#" class="link-1"><em><b>read more</b></em></a></div>
                            </div>
                        </div>
                        <div class="col-1 bg-4">
                         <div class="indent-col">
                             <img alt="" src="images/1page_title4.gif" class="title" /><br />
                                <p>Low glare,<br />
                                creating a more<br />
                                comfortable<br />
                                environment... </p>
                                <div class="container"><a href="#" class="link-1"><em><b>read more</b></em></a></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="footer">
    <div class="main">
        <div class="indent-footer">
          <table width="929" border="0">
            <tr>
              <td width="869">ACLI © 2012 <a href="index-5.html">Privacy Policy</a></td>
              <td><img src="images/followus.gif" alt="" width="73" height="20" /></td>
              <td width="20"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('facebook','','images/facebook2.gif',1)"><img src="images/facebook.gif" width="20" height="20" border="0" id="facebook" /></a></td>
              <td width="20"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('linkedin','','images/linkedin2.gif',1)"><img src="images/linkedin.gif" width="25" height="20" border="0" id="linkedin" /></a></td>
              <td width="20"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('twitter','','images/twitter2.gif',1)"><img src="images/twitter.gif" width="27" height="20" border="0" id="twitter" /></a></td>
            </tr>
          </table>
        </div>
    </div>
</div>
<script type="text/javascript">
swfobject.registerObject("FlashID");
swfobject.registerObject("FlashID2");
</script>
</body>
</html>
The CSS of the layout is as follows:
.col-1, .col-2, .col-3, .col-4, .col-5{ float:left}
/*======= width =======*/
.main{margin:0 auto; text-align:left; width:929px; }
/*======= header =======*/
#header {height:339px; background:url(images/bg.jpg) }
#page1 #header {height:526px;}
/*======= index.html =======*/
#page1 #content .col-1{ width:231px; margin-right:1px}
#page1 #content .bg{ background:url(images/tail.gif) repeat-y 231px top }
#page1 #content .bg1{ background:url(images/tail.gif) repeat-y 463px top }
#page1 #content .bg2{ background:url(images/tail.gif) repeat-y 695px top }
/*======= index-1.html =======*/
#page2 #content .col-1{ width:339px; margin-right:0}
#page2 #content .col-2{ width:590px}
#page2 #content .col-3{ width:154px; margin-right:32px}
#page2 #content .col-4{ width:158px; margin-right:30px}
#page2 #content .col-5{ width:155px; margin-right:0}
/*======= index-2.html =======*/
#page3 #content .col-1{ width:590px; margin-right:0}
#page3 #content .col-2{ width:339px}
#page3 #content .col-3{ width:188px; margin-right:0}
#page3 #content .col-4{ width:155px; margin-right:0}
/*======= index-3.html =======*/
#page4 #content .col-1{ width:339px; margin-right:0}
#page4 #content .col-2{ width:590px}
#page4 #content .col-3{ width:95px; margin-right:2px; text-align:right; line-height:1em; padding-top:3px}
#page4 #content .col-4{ width:188px; margin-right:0}
/*======= index-4.html =======*/
#page5 #content .col-1{ width:590px; margin-right:0}
#page5 #content .col-2{ width:339px}
#page5 #content .col-3{ width:95px; margin-right:2px; text-align:right; line-height:1em; padding-top:3px}
#page5 #content .col-4{ width:188px; margin-right:0}
/*======= footer =======*/
#footer { height:110px; }
The CSS of the style is as follows:
/* CSS Document */
* { margin:0; padding:0;}
html, body { height:100%; }
body {font-size:100%; line-height:1.125em;}
html, input, textarea {
font-family: "Century Gothic";
color:#646464;
.alignMiddle{ vertical-align:middle}
.alignCenter{ text-align: center}
.container1{ width:100%}
object { vertical-align:top; outline:none}
.clear { clear:both;}
.fleft{ float:left}
.fright{ float:right}
div.container { overflow:hidden; width: 100%;}
a img{ border:0}
img{ vertical-align:top; }
a{color:#000000; text-decoration:underline; outline:none}
a:hover{text-decoration:none}
.link{color:#000000; background:url(images/marker.gif) top left no-repeat; padding-left:20px; background-position:0 5px; text-decoration:none; font-size:.916em }
.link:hover{text-decoration:underline }
.button{color:#fff; font-size:.916em; line-height:20px ; padding:2px 8px 8px 6px; text-decoration:none; }
.button:hover{color:#000; background:url(images/button.gif) top left no-repeat; padding:2px 8px 8px 6px; text-decoration:none; line-height:20px ; }
.current{color:#000; background:url(images/button.gif) top left no-repeat; padding:2px 8px 8px 6px; text-decoration:none; line-height:20px ; }
ul{margin:0; padding:0; list-style:none;}
ul li a{color:#646464; text-decoration: underline; line-height:1.66em}
ul li a:hover { text-decoration:none; }
.ul1 li{background:url(images/marker.gif) top left no-repeat; background-position:0 5px; margin:0; padding-left:10px; }
.ul1 li a{color:#646464; text-decoration:none ; line-height:1.5em}
.ul1 li a:hover { text-decoration:underline; }
.ul li{background:url(images/tail-1.gif) repeat-x bottom; margin:0; padding-left:0; }
.ul li span{color:#646464; float:right; background:url(images/tail-2.gif) repeat-x bottom;}
.ul li a{color:#646464; text-decoration: underline; line-height:1.66em; background:url(images/tail-2.gif) repeat-x bottom;}
.ul li a:hover { text-decoration:none; }
.link-1 { display:block; float:left; background:url(images/link_bg.gif) left top repeat-x; color:#ffffff; text-decoration:none; }
.link-1 em { display:block; background:url(images/link_left.gif) no-repeat left top;}
.link-1 b { display:block; background:url(images/link_right.gif) no-repeat right top; padding:0 5px 3px 7px; font-weight:normal; font-style:normal;}
.link-1:hover{ text-decoration:none; color:#627311}
.link-2 { display:block; float:left; background:url(images/link_bg.gif) left top repeat-x; color:#ffffff; text-decoration:none; }
.link-2 em { display:block; background:url(images/link_left.gif) no-repeat left top;}
.link-2 b { display:block; background:url(images/link_right.gif) no-repeat right top; padding:0 15px 3px 17px; font-weight:normal; font-style:normal;}
.link-2:hover{ text-decoration:none; color:#627311}
/*header*/
#header {font-size:0.75em; color:#646464 }
#header .logo{ margin:19px 0 9px 0 }
#header .indent{margin:30px 0 0 755px; position:absolute; width:175px; color:#625a49}
#page1 #header .indent1{padding:40px 0 0 565px}
#header .indent1{padding:22px 0 0 0px}
#header .indent2{padding:11px 0 0 397px}
#header .img-left{ float:left; margin:0 31px 0 0}
#header .img-indent{ margin:0 24px 0 0}
#header .img-indent1{ margin:0 23px 0 0;}
#header .title{ margin-bottom:11px}
#header a{ color:#625a49; text-decoration:none}
#header a:hover{text-decoration: underline}
.flash{ margin:0 -27px 0 -25px; position:relative}
.flash1{ margin:0 0 0 -25px; position: absolute}
#page1 .bg-1{
background-image: url(images/1page_img1.jpg);
background-repeat: no-repeat;
background-position: right bottom;
#page1 .bg-2{ background:url(images/1page_img2.jpg) no-repeat bottom right}
#page1 .bg-3{ background:url(images/1page_img3.jpg) no-repeat bottom right}
#page1 .bg-4{ background:url(images/1page_img4.jpg) no-repeat bottom right}
.bg-5{ background:url(images/bg-1.gif) repeat-x top #e5e5e5; width:100%}
.bg-6{ background:url(images/bg-2.gif) repeat-x top #fff; width:100%}
/*content*/
#content{ font-size:0.75em; width:100%; text-align:left; background:url(images/bg_cont.gif) repeat-x top #fff}
#content .indent-main{padding:11px 0 0 0}
#content .indent-main1{padding:3px 0 0 0}
#content .indent-col{padding:14px 0 28px 20px}
#content .indent-col1{padding:32px 14px 24px 15px}
#content .indent-col2{padding:32px 28px 0 28px}
#content .title{ margin-bottom:8px}
#content .img-left{ float:left; margin:0 20px 16px 0}
#content .img-right{ float:right; margin:0 0 0 10px}
#content .img-indent{ margin:0 0 16px 0}
#content p{ margin:0 0 17px 0}
#content .p{ margin:0}
#content .p1{ margin:0 0 17px 0}
#content h4{color:#8b870e; font-size:1em; margin-bottom:13px; }
#content .tail{ background:url(images/tail2.gif) repeat-x bottom; padding-bottom:26px; margin-bottom:21px}
.txt{ color:#8e9c2e; font-weight:normal}
.txt a{ color:#8e9c2e; }
#content .indent{padding:15px 0 0 0}
/*box*/
.box{ background:#fcfcfc; width:100%;}
.box .indent-box{ padding:11px 18px 11px 20px; }
.box .indent-box1{ padding:11px 10px 11px 10px; }
/*footer*/
#footer { color:#5a5a5a; text-transform:uppercase; font-size:0.6875em ; }
#footer .indent-footer{ padding:37px 0 0 0; background:url(images/bot.gif) repeat-x top;}
#footer a {color:#5a5a5a; text-decoration:underline}
#footer a:hover { text-decoration:none}
.jamp{ width:69px;}
.jamp1{ width:64px;}
.jamp2{ width:58px;}
.jamp3{ width:52px;}
select{font-size:12px; color:#646464; height:19px; font-family: Arial, Helvetica, sans-serif;}
.indent-2{ position:relative; padding-right:20px; float:left}
.h{ height:29px}
.block-contact span{ float:right; margin-right:50px}
input{
width:183px; height:17px;
font-size:1em;
color:#646464;
padding-left:5px;
textarea{
width:183px; height:57px;
font-size:1em;
color:#646464;
padding-left:5px;
margin-bottom:11px;
overflow:auto}
.textarea{
width:183px; height:142px;
font-size:1em;
color:#646464;
padding-left:5px;
margin-bottom:11px;
overflow:auto}
The JS page is as follows:
var ElementMaxHeight = function() {
this.initialize.apply(this, arguments);
ElementMaxHeight.prototype = {
initialize: function(className) {
    this.elements = document.getElementsByClassName(className || 'maxheight');
    this.textElement = document.createElement('span');
    this.textElement.appendChild(document.createTextNode('A'));
    this.textElement.style.display = 'block';
    this.textElement.style.position = 'absolute';
    this.textElement.style.fontSize = '1em';
    this.textElement.style.top = '-1000px';
    this.textElement.style.left = '-1000px';
    document.body.appendChild(this.textElement);
    this.textElementHeight = document.getDimensions(this.textElement).height;
    var __object = this;
    var __checkFontSize = this.checkFontSize;
    this.checkFontSizeInterval = window.setInterval(function() {return __checkFontSize.apply(__object)}, 500);
    this.expand();
    // Refresh elements height onResize event
    var __expand = this.expand;
    if (window.addEventListener) {
      window.addEventListener('resize', function(event) {return __expand.apply(__object, [( event || window.event)])}, false);
    } else if (window.attachEvent) {
      window.attachEvent('onresize', function(event) {return __expand.apply(__object, [( event || window.event)])});
expand: function() {
    this.reset();
   for (var i = 0; i < this.elements.length; i++) {
      this.elements[i].style.height = document.getDimensions(this.elements[i].parentNode).height + 'px';
reset: function() {
    for (var i = 0; i < this.elements.length; i++) {
      this.elements[i].style.height = 'auto';
checkFontSize: function() {
   var height = document.getDimensions(this.textElement).height;
   if(this.textElementHeight != height) {
    this.textElementHeight = height;
    this.expand();
if (!!document.evaluate) {
document._getElementsByXPath = function(expression, parentElement) {
    var results = [];
    var query = document.evaluate(expression, parentElement || document,
      null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
    for (var i = 0, length = query.snapshotLength; i < length; i++)
      results.push(query.snapshotItem(i));
    return results;
document.getElementsByClassName = function(className, parentElement) {
if (!!document.evaluate) {
    var q = ".//*[contains(concat(' ', @class, ' '), ' " + className + " ')]";
    return document._getElementsByXPath(q, parentElement);
} else {
    var children = (parentElement || document.body).getElementsByTagName('*');
    var elements = [], child;
    for (var i = 0, length = children.length; i < length; i++) {
      child = children[i];
      if (child.className.length != 0 &&
          (child.className == className ||
           child.className.match(new RegExp("(^|\\s)" + className + "(\\s|$)")))) {
        elements.push(child);
    return elements;
document.getDimensions = function (element) {
var display = element.style.display;
if (display != 'none' && display != null) { // Safari bug
    return {width: element.offsetWidth, height: element.offsetHeight};
return {width: originalWidth, height: originalHeight};

A sticky footer is position:fixed and therefor always visible in the bottom of browser viewports -- even when users scroll up or down the page.
Sticky Footer Demo:
http://alt-web.com/DEMOS/CSS2-Sticky-Footer.shtml
I believe what you're trying to achieve is 100% height on long & short pages. Try this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>100% height page layout</title>
<style type="text/css">
/**==========================
100% height layout
===========================*/
html,body {
margin:0;
padding:0;
height:100%; /* needed for container min-height */
background:gray;
font-family:arial,sans-serif;
font-size:small;
color:#666;
zoom: 1;
#container {
position:relative; /* needed for footer positioning*/
margin:0 auto; /* center, not in IE5 */
width:1000px;
background:#FF9999;
height:auto !important; /* real browsers */
height:100%; /* IE6: treated as min-height*/
min-height:100%; /* real browsers */
#header {
padding:1em;
background:#ddd;
min-height: 95px;
border-bottom:6px double gray;
#content {
padding:1em 1em 5em; /* bottom padding for footer */
#footer {
position:absolute;
width:100%;
bottom:0; /* stick to bottom */
background:#ddd;
min-height: 95px;
border-top:6px double gray;
#footer p {padding:1em}
</style>
</head>
<body>
<div id="container">
<div id="header">
<p>here is the header</p>
</div>
<div id="content">
<p>Here is the content</p>
</div>
<div id="footer">
<p>Here is the footer</p>
</div>
</div>
</body>
</html>
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

X120e Cant scroll to the bottom with trackpad mid button

Hey, i've been playing with my new x120e for a while and one thing bugs me. As i try to scroll down with the trackpad mid button, sometimes I cant get to the very bottom of the document. I can see there is a little gap at the bottom of the scroll bar. Weirdly it doesn't seem to happen when i scroll up. Any ideas?

Hello,
I just noticed that Lenovo released a new version of the UltraNav drivers, v15.3.27.1:
http://download.lenovo.com/ibmdl/pub/pc/pccbbs/mobiles/6hgx47ww.exe
http://download.lenovo.com/ibmdl/pub/pc/pccbbs/mobiles/6hgx47ww.txt
From the changelog:
CHANGES IN THIS RELEASE
Version 15.3.27.1
[Important updates]
Nothing.
[New functions or enhancements]
Nothing.
[Problem fixes]
- Fixed an issue where the application crash message appeared after setting
TouchPad to disabled in BIOS.
- Fixed an issue where the slowly scrolling stopped just before the last line of the text.
(emphasis mine)
If someone who has experienced this issue could install the updated driver I would be interested in hearing if it solved the issue on your X120e.
Regards,
Aryeh Goretsky
I am a volunteer and neither a Lenovo nor a Microsoft employee. • Dexter is a good dog • Dexter je dobrý pes
S230u (3347-4HU) • X220 (4286-CTO) • W510 (4318-CTO) • W530 (2441-4R3) • X100e (3508-CTO) • X120e (0596-CTO) • T61p (6459-CTO) • T43p (2678-H7U) • T42 (2378-R4U) • T23 (2648-LU7)
Deutsche Community Comunidad en Español Русскоязычное Сообщество

The type inside the footer drops down 50 px below the bottom of page in preview mode. I already tried unchecking the sticky footer in the site properties for that master page.

I need to fix this footer text on the home page. The type on the master page is centered inside a white 50px box. But in preview mode, the line of text drops 50px down below the bottom of page. I unchecked the sticky footer in the site properties and also set the line of text as footer item. The setting was the same on my second master and it comes out fine.

Hi
The "content" div is styled to have 100px height and visible overflow. So the text is overflowing the div but the footer is "unaware" / ingoring it and positions itself after "sidebar2"
Change the height of "content" to 100% and it should work.
Kind Regards,
Alex

Apparent gap below CSS sticky footer in IE?

I've been testing CSS "sticky footer" solutions I found on the Web. The one I picked works in the four browsers I checked with (Firefox, Chrome, Opera and IE) but there's one possible glitch. In IE 8. I'm seeing what appears to be a small gap between the footer and the bottom of the browser window. My Color Cop utility says neither of the two colors in that gap match anything specified in the CSS. I've included a screen capture, and a link if you have IE installed. I'd like to know if this is a problem with IE (who woulda thunk?) or something inherent in the look of IE's browser window?
http://dreamweaverresources.com/tutorials/sticky-footer/

I assume "browser chrome" means the imagery used to create the "pieces" of the browser's appearance outside the browser window contents.
Yes.
http://www.expression-web-tips.com/what-is-browser-chrome/
But, if by scrollbar you mean the sliding blue rectangle on white background with a directional arrow on either end, I don't see that anywhere -- side or bottom -- when I view that link in IE 8?
You'll see it if you shrink the height of your browser below a certain dimension.
I saw it on my widescreen monitor.

Floating Footer ; help me stick the little guy to the bottom Once and For all

Hey there
have floating footer in browsers : I have tried couple of things but not yet got it to stick
here is the website
www.huntfilms.ie
and here is the code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">
body {
          background-color: #3366CC;
          text-align: center;
          margin-top: 25px;
html, body {
          margin: 0px;
          padding: 0px;
#wrapper {
          background-color: #3366CC;
          text-align: left;
#header {
          background-color: #000;
          height: 95px;
          border-bottom-width: thin;
          border-bottom-style: solid;
          border-bottom-color: #FFF;
          background-image: url(titleforwebby.png);
          background-repeat: no-repeat;
          background-position: center;
#veimo1 {
          background-color: #3366CC;
          height: 450px;
#content1 {
          background-color: #3366CC;
          height: 475px;
          width: 820px;
          margin-right: auto;
          margin-left: auto;
          margin-top: 15px;
#vimeoinside {
          background-color: #696;
          height: 450px;
          width: 420px;
#vimeotester {
          background-color: #369;
          height: 350px;
          width: 350px;
#finalvimeo {
          background-color: #3366CC;
          height: 250px;
          width: 250px;
#dropper {
          background-image: url(morebosrder.png);
          background-repeat: repeat-x;
          background-position: center bottom;
          height: 105px;
#footer {
          background-color: #333;
          height: 95px;
          border-top-width: thin;
          border-top-style: solid;
          border-top-color: #FFF;
          position:fixed
                    bottom : 0 ;
                    left: 0 ;
#apDiv1 {
          position:absolute;
          width:397px;
          height:450px;
          z-index:1;
          top: 100px;
          color: #FFF;
          font-family: Tahoma, Geneva, sans-serif;
          font-size: .8em;
          left: 702px;
          float: right;
#apDiv2 {
          position:absolute;
          width:386px;
          height:115px;
          z-index:1;
          font-size: .75em;
          color: #FFF;
          font-family: Tahoma, Geneva, sans-serif;
          left: 285px;
          top: 126px;
          text-align: justify;
</style>
</head>
<body>
<div id="wrapper">
<div id="dropper">
    <div id="header"></div>
</div>
<div id="veimo1">
    <div id="content1"><object width="400" height="380" align="right"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=17962693&server=vimeo.com&show_title=0&show_byline= 0&show_portrait=0&color=00adef&fullscreen=1&autoplay=0&loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=17962693&server=vimeo.com&show_title=0&show_byline= 0&show_portrait=0&color=00adef&fullscreen=1&autoplay=0&loop=0" width="400" type="application/x-shockwave-flash" height="380" allowfullscreen="true" allowscriptaccess="always" align="right"></embed></object>
      <div id="apDiv2">
        <p>Welcome,</p>
        <p>Hunt Films was set up in January 2011 by documentary maker Barry Hunt.</p>
        <p>Barry received training in TV and Video Production with FÁS in Tralee, Co Kerry. During this training Barry produced a series of short films about local artists. In 2006 he worked as assistant editor on the successful RTÉ drama series, ‘Love is the Drug’.</p>
        <p>Since 2010 Barry has embarked on solo projects producing two entertaining half hour documentaries. 'Liberation', explores the world of pigeon racing in Dublin. This film was very well received at the Galway Film Festival 2011 and is due for broadcast on Setanta Sports. More recently Barry produced 'The Gregory Seat', a documentary which follows Maureen O'Sullivan’s campaign to be elected in the 2011 General Election.</p>
        <p>Barry looks forward to producing more documentaries. He is interested in human stories and hopes that this will form the basis of his future work. At present, Barry is developing projects for film festivals and general broadcast.</p>
      </div>
    </div>
</div>
</div>
</body>
<div id="footer"></div>
</html>

Still can get to work
http://www.huntfilms.ie/
body {
background-color: #79BAEC;
text-align: center;
margin-top: 25px;
border-bottom-width: thin;
border-bottom-style: solid;
border-right-color: #000;
border-bottom-color: #C09;
html, body
#wrapper {
background-color: #325C74;
text-align: left;
min-height: 100%;
margin-bottom: -160;
position: relative;
#header {
background-color: #000;
height: 95px;
border-bottom-width: thin;
border-bottom-style: solid;
border-bottom-color: #CC66CC;
background-image: url(titleforwebby.png);
background-repeat: no-repeat;
background-position: center;
#veimo1 {
background-color: #325C74;
height: 450px;
#content1 {
background-color: #325C74;
height: 475px;
width: 840px;
margin-right: auto;
margin-left: auto;
margin-top: 35px;
#newvimo {
background-color: #325C74;
height: 420px;
width: 320px;
font-family: Tahoma, Geneva, sans-serif;
font-size: 0.8em;
color: #FFF;
padding-right: 10px;
text-align: justify;
padding-left: 15px;
padding-top: 15px;
border-left-width: thin;
border-left-style: solid;
border-left-color: #FFF;
#footer1 {
background-color: #000;
height: 120px;
position: relative;
border-top-width: thin;
border-top-style: solid;
border-top-color: #C6F;
font-family: Tahoma, Geneva, sans-serif;
color: #FFF;
font-size: 1.1em;
#vimeoinside {
background-color: #696;
height: 450px;
width: 420px;
#vimeotester {
background-color: #369;
height: 350px;
width: 350px;
#finalvimeo {
background-color: #3366CC;
height: 250px;
width: 250px;
#dropper {
background-image: url(morebosrder.png);
background-repeat: repeat-x;
background-position: center bottom;
height: 103px;
#writing {
background-color: #325C74;
height: 500px;
width: 440px;
float: right;
padding-top: 25px;
padding-left: 0px;
padding-right: 20px;
#apDiv1
#apDiv2
#clearfooter
   !galwayff.png|height=70|width=70|src=galwayff.png!
   Welcome,
   Hunt Films was set up in January 2011 by documentary maker Barry Hunt.
   Barry received training in TV and Video Production with FÁS in Tralee, Co Kerry. During this training Barry produced a series of short films about local artists. In 2006 he worked as assistant editor on the successful RTÉ drama series, ‘Love is the Drug’.
   Since 2010 Barry has embarked on solo projects producing two entertaining half hour documentaries. 'Liberation', explores the world of pigeon racing in Dublin. This film was very well received at the Galway Film Festival 2011 and is due for broadcast on Setanta Sports. More recently Barry produced 'The Gregory Seat', a documentary which follows Maureen O'Sullivan’s campaign to be elected in the 2011 General Election.
   Barry looks forward to producing more documentaries. He is interested in human stories and hopes that this will form the basis of his future work. At present, Barry is developing projects for film festivals and general broadcast
Hunt FIlms is a Certified registered name under the Registration of Business Names Act , 1963. Ireland
   All work is write protected and © Hunt Films 2011
[Home | homt.html]
[Contact | contact.html]
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", );
</script>
  </body>
  </html>
</div

How would I get my footer to appear at the bottom of my browser

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
<style type="text/css">
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
body {
line-height: 1;
background-color: #FFF;
background-image: url(back.png);
background-repeat: repeat;
background-position: left top;
ol, ul {
list-style: none;
blockquote, q {
quotes: none;
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
/* remember to define focus styles! */
:focus {
outline: 0;
/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
del {
text-decoration: line-through;
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
#container {
width: 1100px;
margin-right: auto;
margin-left: auto;
text-align: center;
#container ul {
list-style-position: outside;
margin-right: auto;
margin-left: auto;
#container ul li {
display: inline;
list-style-type: disc;
padding-left: 40px;
#branding {
background-image: url(cb_logo.png);
background-repeat: no-repeat;
background-position: left top;
margin-right: auto;
margin-left: auto;
height: 290px;
width: 342px;
position: relative;
top: 150px;
z-index: 4;
#site_info {
background-color: #461e03;
border-top-width: 4px;
border-top-style: solid;
border-top-color: #cc9933;
margin-right: auto;
margin-left: auto;
position: relative;
padding-top: 100px;
#site_info p {
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
text-decoration: none;
text-align: center;
color: #FFF;
line-height: 2em;
#site_info p em {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 36px;
font-style: normal;
#nav_tools {
background-color: #95b238;
height: 31px;
border-top-width: 2px;
border-top-style: solid;
border-top-color: #b68d41;
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #b68d41;
text-align: center;
margin-top: 100px;
#nav_tools ul {
font-family: Verdana, Geneva, sans-serif;
color: #FFF;
list-style-type: none;
clear: left;
display: inline;
padding-left: 20px;
#nav_tools ul li {
font-family: Verdana, Geneva, sans-serif;
color: #FFF;
list-style-type: none;
clear: left;
display: inline;
padding-left: 20px;
#nav_tools ul li a {
font-family: Verdana, Geneva, sans-serif;
color: #FFF;
list-style-type: none;
clear: left;
display: inline-block;
text-decoration: none;
.clear {
clear: both;
</style>
</head>
<body>
<div id="container">
<ul>
    <li>Walk-in</li>
    <li>Delivery</li>
    <li>Catering</li>
    <li>Special Orders</li>
</ul>
<div id="branding"></div>
</div>
<div id="site_info">
<p><em>Coming soon</em><br/>
    714 Berryville Avenue<br/>
    Winchester, VA 22601<br/>
    At Berryville Avenue and Baker Lane<br/>
    p 540.450.8037<br/>
    f 540.450.8063<br/>
    e [email protected]<br/>
</p>
<div id="nav_tools">
    <ul>
      <li><a href="#">Site Map</a></li>
      <li><a href="#">Privacy Policy</a></li>
      <li><a href="#">Terms of Use</a></li>
    </ul>
</div>
</div>
</body>
</html>

I am using the sticky footer work around to keep my footer at the bottom of the browser window but when I close it my footer gose under my nav_tool DIV why?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
<style type="text/css">
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
body {
line-height: 1;
background-color: #FFF;
background-image: url(back.png);
background-repeat: repeat;
background-position: left top;
ol, ul {
list-style: none;
blockquote, q {
quotes: none;
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
/* remember to define focus styles! */
:focus {
outline: 0;
/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
del {
text-decoration: line-through;
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
#container {
width: 1100px;
margin-right: auto;
margin-left: auto;
text-align: center;
#container ul {
list-style-position: outside;
margin-right: auto;
margin-left: auto;
#container ul li {
display: inline;
list-style-type: disc;
padding-left: 40px;
#branding {
background-image: url(cb_logo.png);
background-repeat: no-repeat;
background-position: left top;
margin-right: auto;
margin-left: auto;
height: 290px;
width: 342px;
position: relative;
top: 150px;
z-index: 4;
#site_info {
background-color: #461e03;
border-top-width: 4px;
border-top-style: solid;
border-top-color: #cc9933;
margin-right: auto;
margin-left: auto;
position: relative;
padding-top: 0px;
height: 300px;
#site_info p {
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
text-decoration: none;
text-align: center;
color: #FFF;
line-height: 2em;
#site_info p em {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 36px;
font-style: normal;
#nav_tools {
background-color: #95b238;
height: 31px;
border-top-width: 2px;
border-top-style: solid;
border-top-color: #b68d41;
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #b68d41;
text-align: center;
margin-top: 100px;
#nav_tools ul {
font-family: Verdana, Geneva, sans-serif;
color: #FFF;
list-style-type: none;
clear: left;
display: inline;
padding-left: 20px;
#nav_tools ul li {
font-family: Verdana, Geneva, sans-serif;
color: #FFF;
list-style-type: none;
clear: left;
display: inline;
padding-left: 20px;
#nav_tools ul li a {
font-family: Verdana, Geneva, sans-serif;
color: #FFF;
list-style-type: none;
clear: left;
display: inline-block;
text-decoration: none;

margin: 0;
html, body {
height: 100%;
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -4em;
.footer, .push {
height: 4em;
background-color: #461e03;
color: #FFF;
</style>
</head>
<body>
<div class="wrapper">
<div id="branding"></div>
<div id="site_info">
    <p><em>Coming soon</em><br/>
      714 Berryville Avenue<br/>
      Winchester, VA 22601<br/>
      At Berryville Avenue and Baker Lane<br/>
      p 540.450.8037<br/>
      f 540.450.8063<br/>
      e [email protected]<br/>
    </p>
    <div id="nav_tools">
      <ul>
        <li><a href="#">Site Map</a></li>
        <li><a href="#">Privacy Policy</a></li>
        <li><a href="#">Terms of Use</a></li>
      </ul>
    </div>
</div>
<div class="push"></div>
</div>
<div class="footer">
<p>Copyright © 2009 City Bagel’s. All rights reserved</p>
</div>
</body>
</html>

25px gap at the bottom of Sticky Footer

Similar Messages

Maybe you are looking for