Page 1 of 1
minimal distance between headre and footer
Posted: Tue Jan 23, 2007 10:33 am
by jan_hut
I would like to put a minimal distance between a header and a footer. Page height should still autoexpand if needed but for esthetic's sake I'd like a minimal space between these 2. Anyone know how to do that?
http://www.hartdesign.nl
I'm using the
andreas00_cmsms : andreas00 stylesheet for this
Re: minimal distance between headre and footer
Posted: Tue Jan 23, 2007 10:47 am
by RonnyK
Jan_Hut,
have you tried min-height, similar to the div#pagewrapper min-width. Be aware that you have to change it both in the css and in the template.
Ronny
Re: minimal distance between headre and footer
Posted: Tue Jan 23, 2007 12:33 pm
by Dr.CSS
You all ready have a min. height if you look at the contact page the footer and menu keep the page from getting any smaller than that...
You may want to use this for your footer...
div#footer {
clear: both; /* keep footer below content and menu */
height: 201px; /* adjust according your image size */
background: #ffffff url(uploads/images/footer2.jpg) no-repeat 0 0;
text-align: center;
}
div#footer p {
font-size: 0.8em;
color: #000;
padding: 10em 0 0; /* some air for footer */
text-align: center; /* centered text */
}
Re: minimal distance between headre and footer
Posted: Wed Jan 24, 2007 11:04 pm
by jan_hut
For some reason that just moves the Copyright message upwards instead of the footer image down. Interestingly though I found the stylesheet is calling the image twice, or so it seems:
div#footer {
clear: both; /* keep footer below content and menu */
color: #000;
height: 221px; /* adjust according your image size */
background: #B5B5B5 url(uploads/images/footer2.jpg) no-repeat 0 0;
text-align: center;
}
div#footer {
clear: both; /* keep footer below content and menu */
height: 221px; /* adjust according your image size */
background: #ffffff url(uploads/images/footer2.jpg) no-repeat 0 0;
text-align: center;
}
div#footer p {
font-size: 0.8em;
color: #000;
padding: 12em; /* some air for footer */
text-align: center; /* centered text */
}