I have a background image that is positioned at the bottom of the body, and on this particular page it messes up in FF:
http://www.freshbeat.co.uk/concept/m...te/service.htm

Shockingly it looks fine in IE! Notice how in FF there is a gap between the bottom of the page and the background image, a white gap.

It only seems to appear on this page on my browser because it is the longest one, but I have no idea how to fix it!

Add

html, body {
     height: 100%;
}

to make the body element extend BEYOND the viewport to the end on the document

Yup, I've already got that in there!

Here is the full css for the site if that helps:

http://www.freshbeat.co.uk/concept/m...te/css/gen.css

@charset "utf-8";
/* default styles */

* {
    padding:0;
    margin:0;
}

html, body {
    height:100%;
}

body {
    background:#FFF url(../image/body.jpg) repeat-x 0 100%;
    font-family:Arial, Helvetica Neue, sans-serif;
    color:#606060;
    font-size:10pt;
}

p {
    margin:.5em 0 1em;
    padding:0;
    line-height:1.5em; }
    
a {
    color:#9d9d9d;
    outline:none;
}

a:hover {
    color:#B4B4B4;
}

.highlight {
    color:#9d9d9d;
}

.gallery {
}

img {
    border:none; }

h1, h2, h3, h4, h5, h6 {
    font-size:110%;
    margin:1.9em 0 .7em;
    font-weight:normal;
}

h1 {
    font-size:140%;
    margin:10px 0 0;
}

h1 strong {
    display:none;
}

h1#about {
    background:url(../image/h1About.gif) no-repeat;
    height:32px;
}

h1#work {
    background:url(../image/h1Work.gif) no-repeat;
    height:32px;
}

h1#service {
    background:url(../image/h1Service.gif) no-repeat;
    height:32px;
}

h1#contact {
    background:url(../image/h1Contact.gif) no-repeat;
    height:32px;
}

























http://www.freshbeat.co.uk/concept/m.../css/divId.css

@charset "utf-8";
/* div id's */

#headerWrapper {
    background:url(../image/header.png) repeat-x;
    height:105px;
    border-top:#696969 solid 1px;
    position:absolute;
    top:0;
    left:0;
    width:100%;
}

#header {
    width:815px;
    margin:0 auto;
    color:#FFF;
    position:relative;
    height:90px;
}

#header img {
    position:absolute;
    right:30px;
    bottom:0;
}

#wrapper {
    width:755px;
    padding:0 30px;
    margin:0 auto;
    overflow:auto;
    background:url(../image/wrapper.png);
}

#content {
    background:url(../image/content.gif) no-repeat 100% 0;
    margin-top:90px;
    padding-top:40px;
    overflow:auto;
    border-bottom:#606060 dotted 1px;
}

#contentIndex {
    margin:60px auto 70px;
    width:631px;
}

#contentAbout {
    background:url(../image/imgAbout.jpg) no-repeat 100% 100%;
    min-height:305px;
}

#contentService1, #contentService2 {
    background:url(../image/imgAbout.jpg) no-repeat 100% 100%;
    min-height:305px;
}

#contentService2 {
    background-position:0 100%;
}









#footer {
    background:url(../image/footer.png) no-repeat 0 100%;
    width:755px;
    padding:10px 30px 20px;
    margin:0 auto;
    overflow:auto;
}

#footer a {
    text-decoration:none;
    color:#606060;
}

#footer .highlight {
    color:#9d9d9d;
}

#footer .left, #footer .right {
    padding:0;
    margin:0;
    width:300px;
    text-align:left;
    float:left;
}

#footer .right {
    text-align:right;
    float:right;
}

http://www.freshbeat.co.uk/concept/m...s/divClass.css

@charset "utf-8";
/* div classes */

.contentLeft {
    padding-right:310px;
    overflow:auto;
}

.contentRight {
    padding-left:310px;
    margin-top:35px;
    overflow:auto;
}

.colLeft {
    width:445px;
    float:left;
}
http://www.freshbeat.co.uk/concept/m...e/css/list.css

@charset "utf-8";
/* lists */

ul li {
    list-style-type:none;
}

#nav {
    position:absolute;
    top:50px;
    left:10px;
    width:320px;
}

#footer ul {
    float:right;
}

#footer ul li {
    float:left;
    margin-left:5px;
    padding-left:5px;
    background:url(../image/ulBtmLi.gif) no-repeat center left;
}

ul .end {
    border:none !important;
    background:none !important;
}











http://www.freshbeat.co.uk/concept/m...te/css/frm.css

@charset "utf-8";
/* forms */

form {
    width:255px;
    height:286px;
    float:right;
    padding:10px;
    background:url(../image/frmContact.jpg) no-repeat;
    margin-bottom:20px;
}

form h2 {
    margin-top:0;
}

input[type="text"], textarea {
    border:none;
    background:#FFF;
    font-size:90%;
    font-family:Arial, Helvetica, sans-serif;
    height:15px;
    left:5px;
    top:4px;
    position:absolute;
    width:175px;
    color:#505050;
}

textarea {
    height:75px;
}

input[type="submit"] {
    float:right;
    background:url(../image/inputSubmit.png) no-repeat center center;
    text-align:right;
    color:#FFF;
    width:80px;
    border:none;
    padding:4px 5px 5px;
}

input[type="submit"]:active {
    position:relative;
    top:1px;
}

.wrapperInput, .wrapperTextarea  {
    width:185px;
    height:24px;
    float:right;
    background:url(../image/wrapperInput.png) no-repeat;
    position:relative;
}

.wrapperTextarea {
    height:83px;
    background-image:url(../image/wrapperTextarea.png);
}

.row {
    margin-bottom:15px;
    overflow:auto;
}

form .btm {
    margin-bottom:10px;
}

label {
    float:left;
    text-align:right;
    display:block;
    padding-top:0.4em;
    width:65px;
    font-size:90%;
}

.popBox {
    width:350px;
    position:fixed;
    float:left;
    right:50%;
    top:200px;
    padding-top:10px;
    background:url(../image/popTop.png) no-repeat center 0;
}

.popBox div {
    padding:0 10px;
    border:#9d9d9d solid;
    border-width:0 1px;
    background:#505050;
}

.popBox p {
    margin:0;
    color:#FFF;
}

.popBox ul {
    padding:.5em 0 1em;
    margin:0;
    color:#FFF;
}

.popBox ul li {
    background:none;
}

.popBtm {
    padding:0 10px 10px;
    margin:0;
    background:url(../image/popBtm.png) no-repeat center 100%;
}

.popBtm a {
    color:#B4B4B4;
}

.popBtm a:hover {
    color:#FFF;
}








http://www.freshbeat.co.uk/concept/m...imgReplace.css

@charset "utf-8";
/* use transparent .png's! */


http://www.freshbeat.co.uk/concept/m...7.2.custom.css

/*
* jQuery UI CSS Framework
* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
*/

/*.ui-tabs .ui-tabs-nav li { position: relative; float: left; border-bottom-width: 0 !important; margin: 0 .2em -1px 0; padding: 0; }
*/
.ui-tabs .ui-tabs-hide { display: none !important; }



/* edit */
#tabs {
    margin:0;
    min-height:300px;
}

#tabs ul {
    float:right;
    display:block;
}

#tabs li {
    display:inline;
}

#tabs ul a {
    float:left;
    text-align:center;
    color:#505050;
    text-decoration:none;
    margin-left:.5em;
    padding:3px 10px 4px;
    min-width:85px;
    background:url(../../../../../image/tab.gif) repeat-x center center;
}

#tabs ul a:hover, .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
    background-image:url(../../../../../image/tabHover.gif) !important;
    color:#FFF !important;
}

#tabs div {
    clear:both;
    border-top:#9e9e9e solid 1px;
    padding-top:15px;
    overflow-y:auto;
    text-align:right;
}

#tabs img {
    margin:0 0 5px 5px;
}

#tabs a {
    cursor:pointer;
}
http://www.freshbeat.co.uk/concept/m...s/lavalamp.css

        .lavaLampWithImage {
            position: relative;
            overflow: hidden;
            padding-left:20px;
        }
                .lavaLampWithImage li {
                    float: left;
                    list-style: none;
                }
                    .lavaLampWithImage li.back {
                        background:url(../../image/navHoverRight.png) no-repeat right bottom;
                        width: 15px;
                        z-index: 8;
                        position: absolute;
                    }
                        .lavaLampWithImage li.back .left {
                            background:url(../../image/navHoverLeft.png) no-repeat left bottom;
                            height: 30px;
                            margin-right: 9px; /* 7px is the width of the rounded shape */
                        }
                    .lavaLampWithImage li a {
                        text-decoration: none;
                        color: #FFF;
                        text-align: center;
                        z-index: 10;
                        float: left;
                        position: relative;
                        overflow: hidden;
                        margin: auto 5px;
                        padding:10px 5px 30px;  
                    }
                        .lavaLampWithImage li a:hover, .lavaLampWithImage li a:active, .lavaLampWithImage li a:visited {
                            border: none;
                        }