控制子容器滾動

Question

場景：

我有一個包含表頭和包含表數據的子DIV父DIV。

目的：

我希望能夠水平滾動，其滾動左到右的所有內容，如果表中的數據垂直溢出，我希望能夠在視圖中的頭垂直滾動。

問題：

如果表數據垂直溢出和寬度超過父容器，我無法看到垂直滾動條，除非我沿着滾動，因此標題。

我在這裏設置了一個例子：http://jsfiddle.net/uRHkU/2/ - 我試圖實現的可能性是什麼？

<div class="parentDiv"> 
    <p>very very very long header</p> 
    <div class="childDiv"> 
     <p>content that stretches the full width</p> 
     <p>content that stretches the full width</p> 
     <p>content that stretches the full width</p> 
     <p>content that stretches the full width</p> 
     <p>content that stretches the full width</p> 
     <p>content that stretches the full width</p> 
     <p>content that stretches the full width</p> 
     <p>content that stretches the full width</p> 
     <p>content that stretches the full width</p> 
     <p>content that stretches the full width</p> 
    </div> 
</div> 

Answer 1

在「parentDiv」上嘗試overflow: auto並刪除所有overflow-xy-Stuff。

Answer 2

你至少有兩種方法可以獲得水平滾動 請記住，這是你的段落元素誰溢出！

替代1 使用

.parentDiv 
{ 
    width: 500px; 
    height: 300px; 
    overflow:auto; 

} 
.parentDiv p { 
    display:inline; 
} 

，你會得到一個滾動條的所有設置

替代2

.parentDiv 
{ 
    width: 500px; 
    height: 300px; 

} 
.parentDiv p { 

    overflow:auto; 
} 

在這裏，你會得到一個滾動酒吧爲

編輯評論：您可以省略段落的內聯規則。就像這個小提琴一樣。我希望它能找到你想要的東西。 這裏提琴Child scrollbar Alternative 1