Solved

Getting a body background to be at the bottom of the page

Posted on 2008-06-18
1
754 Views
Last Modified: 2012-06-21
http://ne3d.cwtclients.co.uk/homepage

In the link above I've set a background using CSS so that the body tag should have a background image center aligned and at the bottom of the page. In IE this is working fine, but in FF it's putting the background at the bottom of the window rather than the bottom of the page. So when you scroll down the background image is in the middle of the page.

Can anyone help resolve this.

I've attached some css
html {
	height: 100%;
	}
 
body {
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	background: url(../images/body-bg.png) center bottom no-repeat;	
	font-family: Arial, Helvetica, sans-serif;
	}

Open in new window

0
Comment
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
1 Comment
 
LVL 2

Accepted Solution

by:
TheVanter earned 500 total points
ID: 21814130
remove the:

html {
        height: 100%;
        }

from your css and it works
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
removing a class in javascript 4 97
Make footer stick to bottom 6 39
Top Aligning Inner Divs 5 34
carousel control extend past the images 9 30
Unordered lists (HTML ul tags) are very handy to create menus of all types, shapes and sizes.  All it takes is a little knowledge of CSS and the possibilities are endless. First off, you should know the general format for menus created using the …
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question