grindy Posted March 7, 2010 Report Share Posted March 7, 2010 (edited) for some reason my footer on my web page attaches itself to the bottom of the header, the only way i can put it at the bottom of the page is by using margin. why wont it attach itself by default to the bottom of my two columns.i have it like this<div id="container"><div id="header"></div><div id="col1"></div><div id="col2"></div><div id="footer"></div></div> end of container divhere is the css for it body { font: 100% Verdana, Arial, Helvetica, sans-serif; background-image:url("images/skystrip2.gif"); margin: 0; padding: 0; text-align: center; color: #ffffff; } #container { width: 78%; height: 700px; margin: 0px auto; text-align: left; border: 1px solid #fff; border-width: 1px 1px 1px 1px; } #header { width: 100%; height: 70px; border: 1px solid #fff; border-width: 1px 1px 1px 1px; text-align: center; } #col1 { float: left; width: 25%; height: 545px; border: 1px solid; border-width: 1px 1px 1px 1px; color: #fff; } #col2 { float: left; width: 74.4%; height: 545px; border: 1px solid; border-width: 1px 1px 1px 1px; color: #fff; } #footer { position: absolute; clear: both; width: 100%; height: 36px; padding: 0px 0px 0px 0px; border: 1px solid #fff; border-width: 1px 1px 1px 1px; text-align: center; } fltrt { float: right; margin-left: 8px; } fltlft { float: left; margin-right: 8px; }the footer should position itself at the bottom of the two columns, not at the bottom of the headerI have the header width at 100% and it makes itself 100% of the container.I have the footer width at 100% and it makes itself 100% of the body instead of the containerIts almost as if the footer isn't in the container. seems like its in the body portion of the page.also, when i put an inline frame in column 2, the footer disapears completely. Edited March 7, 2010 by grindy Link to comment Share on other sites More sharing options...
thescientist Posted March 8, 2010 Report Share Posted March 8, 2010 (edited) position: absolute's not going to help the situation any. That's exactly why it won't do what you want it to do; appearing outside of the container. Also, block level elements will take up the available width of their containing element by default. Perhaps looking up CSS tutorials; on the box model and positioning. Edited March 8, 2010 by thescientist Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now