頁面不會滾動;使用CSS固定位置表

我已經完成了任何重型HTML/CSS工作已經有多年了，最近我開始對我公司的網站進行大修。我對設計的方式非常滿意，一切似乎都奏效，但現在我的內容正在填充頁面，但我意識到儘管頁面內容低於「摺頁」，頁面仍然不會滾動。頁面不會滾動;使用CSS固定位置表

我猜這是因爲我使用固定位置的CSS表。我嘗試將位置屬性更改爲'相對'，儘管這固定了滾動問題，但它弄糟了佈局，我不確定如何使它工作。

這裏是我的代碼小提琴：http://jsfiddle.net/jbooth63/SKnsc/

這裏是對代碼的實時預覽鏈接：http://www.financecapital.us/test/test.html

任何幫助將不勝感激！這裏是我使用的代碼的一個例子：

<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 the 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>

來源

2013-08-19 Jennifer Booth

爲什麼這會降低投票率？ –

這很容易，我自己用鉻開發工具完成它。

問題是你正在使用：「position：fixed;」在你的div。

使用「position：absolute;」在每一個div上都應該有效。

希望它可以幫助你。

來源

2013-08-19 20:24:05

這是正確的。這裏是一個小提琴，展示了當你改變你所有的位置時：固定位置到絕對位置; http://jsfiddle.net/QEwRG/ –

修正了它。謝謝 - 你是我的英雄！ –

@DrydenLong現在這個鏈接被破壞了。 – brandaemon

頁面不會滾動;使用CSS固定位置表

回答

相關問題