調整瀏覽器窗口大小時如何滾動固定的div

Question

我創建了一個position: fixed div ，該position: fixed必須始終在頂部， width: 900px ，現在我width: 900px以下問題，當我將瀏覽器窗口的大小調整為小於900px我的div被裁剪了，我什至不能進行滾動，因為沒有出現滾動條。 我該如何解決？

代碼如下： <body> <div class= "bar"><div class="inner_div"></div></div> </body>

現在的CSS

.bar { position: fixed; height: 60px; width: 900px; border: 2px solid; }

.inner_div {position: absolute; right: 5px; top: 2px; border: 2px solid;  width: 100px; height: 15px;}

嘗試使用此代碼，您將看到，如果瀏覽器窗口小於900像素，則該條被裁剪，無法滾動它並查看inner_div。

Answer 1

我很確定某些瀏覽器僅使用非固定元素來確定內容的寬度。 在頁面底部添加類似的內容可以使您的滾動條<div style="width:900px;"></div>

以前我沒有提到間距div不能為空或必須具有高度，因此添加不間斷空格或1px高度將使其填充寬度。

完整代碼示例： http : //jsfiddle.net/8LnBr/

<style>
.bar { position: fixed; height: 60px; width: 900px; border: 2px solid; }
.inner_div {position: absolute; right: 5px; top: 2px; border: 2px solid;  width: 100px; height: 15px;}
.spanner{width:900px; height:1px;}
</style>
<body>
 <div class= "bar">
  <div class="inner_div"></div>
 </div>
 <div class="spanner"></div>
</body>

調整瀏覽器窗口大小時如何滾動固定的div

問題描述

1 個解決方案

解決方案1
0 已采納 2013-04-09 18:39:22

調整瀏覽器窗口大小時如何滾動固定的div

問題描述

1 個解決方案

解決方案1 0 已采納 2013-04-09 18:39:22

解決方案1
0 已采納 2013-04-09 18:39:22