How to get Footer to stay at the bottom of page?


First of all I need to say that I virtually have no experience in CSS. I am trying to edit a website template.

The issue is that the footer container is currently half way up the page. I need to make it so it sits at the bottom of the page in any browser. It needs to be dynamic and change with the browser size.

The code in the style.css is as follows:

#footer {float:left;width: 100%;margin:30px 0 0 0;background:url(images/content_bg.png) repeat;padding:10px 0;}
.background_img {width:100%;height:100%;position:absolute;top:0;left:0;z-index:-5;}

Difference between (display: block; float: left;) and display: inline; ?

I see many people use these two different techniques and I want to know which technique does what ? and what are the differences ? and which technique to use in which situation ?

Floating problem


I'm trying to create a front end to a search engine I'm building. So once the search item is selected (within the dropdown menu) a database driven list is generated (yellow box). However the red box height does not clear ;(((((. The blue boxes are going to be + and - buttons to create new search objects.

Can anybody help? It's driving me mad!!!!!


<!DOCTYPE html>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<style TYPE="text/css">
		*,ul {
		text-decoration: none;
		list-style-type: none;

List Items not Centering in Table for IE (related to WhiteSpace Error)

Hi, I was updating a webpage for our website and I would like to center list items in an already centered table, however the White Space Error occurs when viewing in Internet Explorer.
So when I want bullets to look like this
---------table cell start---------
*list item one
*list item two

-------table cell end--------------

they end up looking like this:

---------table cell start---------
* list item one
* list item two

---------table cell end------------

Float variable width divs.

Searched the forum and found nothing if there is any similar post please direct me to it.

I have this code:

<html xmlns="">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<div id="container" style="width:1024px;">
<div id="left" style="position:relative; width:auto; background:#0F0; height:500px; float:left;"></div>
<div id="right" style="position:relative; width:200px; background:#C30; height:500px; float:left;"></div>

Syndicate content