html - Page won't scroll; using CSS fixed position tables -


it's been years since have done heavy duty html/css work, , started overhaul of company's website. i'm pretty happy way design turning out , seems work, content filling page have realized page won't scroll, despite there being content below 'the fold'.

i'm guessing because i'm using css tables fixed positions. tried changing position attribute 'relative', , although fixed scrolling issue, messed layout , i'm not sure how make work.

here fiddle code: http://jsfiddle.net/jbooth63/sknsc/

and here link live preview of code: http://www.financecapital.us/test/test.html

any appreciated! here example of code using:

<head> <style type="text/css"> body,td,th { font-family: gotham, "helvetica neue", helvetica, arial, sans-serif; font-style: normal; font-weight: normal; font-size: 10px; color: #333;}  body { background-color: #fff;}  .socialcell { position: fixed; margin-top: 105px; margin-left: 5px; background-color: #ff9900;}   .headerimg { position: fixed; margin-left: 5px; margin-top: 5px;}  .leftsidebar { position: fixed; margin-top: 155px; margin-left: 5px; background-color: #eee; border-right: .1em dotted #369; border-bottom: .1em dotted #369;} </head> <body> <div class="headerimg"><img src="header2.jpg" title="financing world's equipment.">     </div>   <div class="socialcell"> <table width="300" height="50"> <tr> <td><center> <a href="https://www.facebook.com/financecapitalut"><img src="facebook.png" title="finance  capital on facebook" height="40"></a> <a href="http://www.linkedin.com/company/finance-capital-llc?trk=hb_tab_compy_id_477909#">   <img src="linkedin.png" title="finance capital on linkedin" height="40"></a> <a href="https://twitter.com/financecap"><img src="twitter.png" title="@financecap on  twitter" height="40"> </center></td> </tr> </table> </div> 

that's easy pal, i've done myself using chrome developer tools.

the problem you're using: "position: fixed;" on divs.

using "position: absolute;" on every div, should work.

hope helps you.


Comments

Popular posts from this blog

Detect support for Shoutcast ICY MP3 without navigator.userAgent in Firefox? -

web - SVG not rendering properly in Firefox -

java - JavaFX 2 slider labelFormatter not being used -