CSS Make div stay at bottom of page
I have designed a page in Fireworks then imported it to Dreamweaver in CSS slices. I want the last slice (indexr4c1) to stay at the bottom of the page when content in the middle slice (indexr3c2) overflows off the bottom of it, I don't know if this is possible the way I have done it...here is my code: 

        <html>
        <head>
        <title>index.gif</title>
        <meta http-equiv="Content-Type" content="text/html;iso-8859-1">
        <meta name="description" content="FW MX CSS Layer">
        <style type="text/css">
        #indexr1c1 {
	position:absolute;
	left:0px;
	top:0px;
	width:955px;
	height:143px;
	background-image:url(index_r1_c1.gif);
        }
        #indexr2c1 {
	position:absolute;
	left:0px;
	top:143px;
	width:955px;
	height:56px;
	background-image:url(index_r2_c1.gif);
        }

        #indexr3c1 {
	position:absolute;
	left:0px;
	top:199px;
	width:185px;
	height:326px;
	background-image:url(index_r3_c1.gif);
        }
        #indexr3c2 {
	position:absolute;
	left:185px;
	top:199px;
	width:608px;
	height:326px;
	background-image:url(index_r3_c2.gif);
        }
        #indexr3c3 {
	position:absolute;
	left:793px;
	top:199px;
	width:162px;
	height:326px;
	background-image:url(index_r3_c3.gif);
        }
        #indexr4c1 {
	position:absolute;
	left:0px;
	top:525px;
	width:955px;
	height:75px;
	background-image:url(index_r4_c1.gif);
        }
        </style>
        </head>
        <body bgcolor="#ffffff" >
        <div id="indexr1c1"></div>
        <div id="indexr2c1"></div>
        <div id="indexr3c1"></div>
        <div id="indexr3c2"></div>
        <div id="indexr3c3"></div>
        <div id="indexr4c1"></div>
        </body>
        </html>

Thanks very, very much in advance for any replies :)



CSS Make div stay at bottom of page
===

I have designed a page in Fireworks then imported it to Dreamweaver in CSS slices. I want the last slice (indexr4c1) to stay at the bottom of the page when content in the middle slice (indexr3c2) overflows off the bottom of it, I don't know if this is possible the way I have done it...here is my code: 

        <html>
        <head>
        <title>index.gif</title>
        <meta http-equiv="Content-Type" content="text/html;iso-8859-1">
        <meta name="description" content="FW MX CSS Layer">
        <style type="text/css">
        #indexr1c1 {
	position:absolute;
	left:0px;
	top:0px;
	width:955px;
	height:143px;
	background-image:url(index_r1_c1.gif);
        }
        #indexr2c1 {
	position:absolute;
	left:0px;
	top:143px;
	width:955px;
	height:56px;
	background-image:url(index_r2_c1.gif);
        }

        #indexr3c1 {
	position:absolute;
	left:0px;
	top:199px;
	width:185px;
	height:326px;
	background-image:url(index_r3_c1.gif);
        }
        #indexr3c2 {
	position:absolute;
	left:185px;
	top:199px;
	width:608px;
	height:326px;
	background-image:url(index_r3_c2.gif);
        }
        #indexr3c3 {
	position:absolute;
	left:793px;
	top:199px;
	width:162px;
	height:326px;
	background-image:url(index_r3_c3.gif);
        }
        #indexr4c1 {
	position:absolute;
	left:0px;
	top:525px;
	width:955px;
	height:75px;
	background-image:url(index_r4_c1.gif);
        }
        </style>
        </head>
        <body bgcolor="#ffffff" >
        <div id="indexr1c1"></div>
        <div id="indexr2c1"></div>
        <div id="indexr3c1"></div>
        <div id="indexr3c2"></div>
        <div id="indexr3c3"></div>
        <div id="indexr4c1"></div>
        </body>
        </html>

Thanks very, very much in advance for any replies :)


