如何將一個滾動條附加到div內數據網格的右側？

Question

我正在創建一個包含Datagrid的可滾動div ，如下所示： -

<div id="myDiv"
     style="overflow: auto; height: 300px; "
     onscroll="myFunction();">
     <asp:DataGrid id="gradesGrid"
     .
     .
     .
     </asp:DataGrid>
</div>

並且滾動條正好出現。 但是，正如我所希望的那樣，它不是附加到div內容的右側，而是隱藏了DataGrid的右邊緣。 這會導致出現煩人的水平滾動條。 有沒有辦法說服div將滾動條附加到DataGrid的外部而不是頂部？

Answer 1

據我所知， 目前不支持。

如果您不介意div中垂直滾動條的輕微切除，只需應用以下內容：

overflow-x: hidden;

隱藏水平滾動條（上方），或增加div的大小=滾動條的像素寬度。 也許實現一些填充？

padding-right: <value of the width of the scrollbar>;

編輯： *我建議填充的原因是因為你說你想要它在外面，現在你不能這樣做，但如果它在外面其他內容則必須用邊距或填充調整 - 所以真的沒關系（這可能是你不能在第一個地方設置滾動條的原因）。

例如，如果你有一個滾動條，它是10px寬你需要一個規則在其他div上，或者它旁邊的任何東西，在它的一側有一個“觸及”滾動條的邊距為10px。 在包含元素上添加填充更容易。* 編輯結束。

您還可以設置滾動條的寬度，例如webkit：

::-webkit-scrollbar 
{
    width: 10px;
    height: 10px;
}

這是一個非常誇張的例子： http ： //jsfiddle.net/eFhnN/