javascript - Footer Only sticks to bottom of SCREEN not content -


this question has answer here:

i start saying, posting because response on website not @ regarding topic, solutions given i've tried , have not worked. (if have missed 1 apologize)

link: nova.it.rit.edu/~whateverokay/index.php

i have tried:

making wrapper position relative , adding padding bottom not help. making footer position absolute, not help. goes bottom of screen not content. , therefore covers bunch of content.

i have read these:

  • matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page

  • wordpress.org/support/topic/fixed-footer-covering-content

  • webdeveloper.com/forum/showthread.php?202513-position-footer-at-bottom-regardless-of-content-height

  • any question related on website.

  • and few others cannot recall , yes sticky footer of sites linked (cssstickyfooter.com/)

basic structure:

   <div id="mainhead">     other divs hold header     </div>     <div id="wrapper">     <div id="content">     content here     </div>     </div>     <div id="footer">     <footer>     content here     </footer> </div> 

css:

    #wrapper{ position:relative; min-height:100%; height:100%; padding-bottom:0px 0px 100px; } #content{ width:60%; position:relative; padding:10px; } #content, footer{ margin-left:auto; margin-right:auto; } #footer{ font-size:9pt; font-style:italic; text-align:center; overflow:auto; height:100px; position:absolute; bottom:0px; width:100%; margin-top:50px; border-top:4px solid #35475f; background-color:#35475f; clear:both; } footer{ width:60%; } 

yes of may unnecessary, i've been trying everything. what cannot use: jquery position fixed not work because covers content. furthermore needs @ end of content.

this school project. have restrictions. must ie8 compatible. javascript okay, if knows solution that.

create div called "container" @ top, add footer div end of it

<div id="container">    <div id="mainhead">        other divs hold header    </div>     <div id="wrapper">       <div id="content">        content here       </div>     </div>     <div id="footer">      <footer>         content here      </footer>     </div> </div> 

oh yeah, , rid of css junk (almost everything)


Comments

Popular posts from this blog

python - mat is not a numerical tuple : openCV error -

c# - MSAA finds controls UI Automation doesn't -

wordpress - .htaccess: RewriteRule: bad flag delimiters -