Webpage to be “screensize” and content scrolls instead of page

Hi

New Member
I'm looking at making a webpage with a sticky footer. My sticky footer works fine (except for a page with little content, but I can fix that). I had hoped with my sticky footer, sticking to the bottom of the page that I wouldnt have to scroll down to see it. I seem to have a large amount of empty space between the last of my content and my footer (I can fix that later).But back to the point, what I want is the footer to be on the bottom of the screen, not the page, and if content requires scrolling, then its behind the footer and the content itself is scrollable, not the entire page, if anyone knows what I mean?I assume its CSS, so I'll include the CSS only, if html is needed, I will edit and add it.\[code\]body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset,input, blockquote {margin: 0; padding: 0; border: 0;}body {font-family: Helvetica, Arial, Sans-Serif; line-height: 24px;background: #ebebeb url(images/bg.png) center top repeat-y;}#container {width: 600px; margin: 0 auto; position:relative; }#ImgGallery {position:relative;width:600px;height:400px;margin:20px auto 0 auto;}#ImgGallery ul {padding:0;margin:0;list-style-type:none;}#ImgGallery a.gallery span {position:absolute;width:1px;height:1px;top:-1px;left:-1px;overflow:hidden;background:#fff;color:b00a38;}#ImgGallery a.gallery, #ImgGallery a.gallery:visited {display:block;color:#000;text-decoration:none;border:1px solid #000;margin:1px 2px 1px 2px;text-align:left;cursor:default;}#ImgGallery a.slidea {background:url('images/Picture 014 thumb.jpg');height:38px;width:50px;}#ImgGallery a.slideb {background:url('images/Picture 015 thumb.jpg');height:38px;width:50px;}#ImgGallery a.slidec {background:url('images/Picture 016 thumb.jpg');height:38px;width:50px;}#ImgGallery a.slided {background:url('images/Picture 017 thumb.jpg');height:38px;width:50px;}#ImgGallery a.slidee {background:url('images/Picture 027 thumb.jpg');height:38px;width:50px;}#ImgGallery a.slidef {background:url('images/Picture 035 thumb.jpg');height:38px;width:50px;}#ImgGallery a.slideg {background:url('images/Picture 039 thumb.jpg');height:38px;width:50px;}#ImgGallery a.slideh {background:url('images/work dinosaur 002 thumb.jpg');height:38px;width:50px;}#ImgGallery a.slidei {background:url('images/work dinosaur 010 thumb.jpg');height:38px;width:50px;}#ImgGallery a.slidej {background:url('images/work dinosaur 011 thumb.jpg');height:38px;width:50px;}#ImgGallery a.slidek {background:url('images/work dinosaur 012 thumb.jpg');height:38px;width:50px;}#ImgGallery a.slidel {background:url('images/work dinosaur 015 thumb.jpg');height:38px;width:50px;}#ImgGallery ul {margin:200px 0 0 150px;width:350px;height:38px;}#ImgGallery li {float:left;}#ImgGallery a.gallery:hover {border:1px solid #fff;}#ImgGallery a.gallery:hover span {position:absolute;width:200px;height:200px;top: -200px;left:200px;color:#000;}#header {overflow: hidden;padding: 0 0 10px 0;}#header h1 { float: left;}#header ul#categories { /*menu settings */ float: left; list-style: none; margin: 25px 0 0 0;} #header ul#categories li { float: left; margin: 0 0 0 15px; } #header ul#categories li a { display: block; font-size: 12px; font-weight: bold; color: #b20938; text-decoration: none; } #header ul#categories li a:hover { color: #800427; }#content {overflow: hidden; padding: 5% 0 0 0;}#content #avemenu a { /* link settings in main */ font-weight: normal; color: #b20938; text-decoration: none;} #content a:hover { color: #800427; } #content #main { /* post content spacing etc */ width: 600px; float: left; padding: 0 0 0 0 ; } #content #main h2 { /*space between post heading and content */ margin: 0 0 0px 10px; font-size: 14px; font-weight: bold; text-transform: uppercase; color: #b20938; } #content #main p { /*post text settings */ margin:0 0 25px 10px; color: #000000; font-size: 12px; } #content #main .post { /*post box */ background: #ebebeb url(images/contentheadbg.png) right top repeat-x; padding: 0 10px 0 0; margin: 0 0 20px 0; overflow: hidden; }#content #main .post .post-content {width: 600px;}#content #main .post .post-content ul.post-meta { width: 600px; height: 21px; list-style: none; padding: 0 0 0 10px; margin: -20px 0 0 0; background: #ebebeb url(images/contentheadbg.png);} #content #main .post .post-content ul.post-meta li { float: left; margin: 0 40px 0 0; font-size: 12px; font-weight: bold; color: #000000; } #content #main .post .post-content ul.post-meta li.see-more { float: right; margin: 0 20px 0 0; } /*#menu { width: 600px; }*/#footer {background: url(images/footer.jpg) center bottom no-repeat; overflow: hidden;}#footer ul#pages { overflow: hidden; list-style: none; float: left; padding: 0 0 0 0; margin: 0 0 0 0;} #footer ul#pages li { float: left; margin: 0 0 0 75px; } #footer ul#pages li a { display: block; font-size: 12px; font-weight: bold; color: #b20938; text-decoration: none; } #footer ul#pages li a:hover { color: #800427; } #map {float: right;}/* simple wordpress contact form */ div#simple-contact-form {}div#simple-contact-form form {}#simple-contact-form fieldset {}#simple-contact-form label {}#simple-contact-form input {}#simple-contact-form textarea {}#simple-contact-form fieldset input {} /* excludes submit button */#simple-contact-form div.scf-submit input {} /* submit button */#simple-contact-form input:focus,#simple-contact-form textarea:focus {}p.scf_spam,p.scf_error {}p.scf_success {}p.scf_reset {}#scf_success {}#simple-contact-form fieldset input.scf_error {}#simple-contact-form fieldset textarea.scf_error {}a:link {text-align: center;}html, body {height: 100%;}#container {min-height: 100%;}#content {overflow:auto;padding-bottom: 110px; /* must be same height as the footer */}#footer {position: relative;margin-top: -110px; /* negative value of footer height */height: 110px;width: 600px;margin: 0 auto;clear:both;}/*Opera Fix*/body:before {content:"";height:100%;float:left;width:0;margin-top:-32767px;}\[/code\]
 
Top