防止y-scroll-auto改變div的內部寬度

Question

有沒有辦法阻止y-scroll-bar改變div容器的內部寬度。 div容器的孩子可以總是有正確的填充，直到滾動條出現？ js fiddle

HTML

<div> 
    <span> 
    Lorem ipsum dol... 
    </span> 
</div> 

CSS

div { 
    border: solid 1px; 
    width: 200px; 
    height: 150px; 
    overflow: auto; 
    margin: 10px; 
} 

span { 
    display: block; 
    background: rgba(122, 150, 255, 0.23); 
} 

Answer 1

通過元件的名稱替換元件：

在示例中，文本根據垂直滾動條的存在具有不同的寬度您希望此功能處於活動狀態。
Overlay在元素頂部添加滾動條，而不是將其添加到元素中。

element { 
    overflow-y :overlay; 
    } 

Jsfiddle

我已經更新的jsfiddle。現在這兩個元素是相同的。
儘管滾動條仍然位於頂部。你可以通過initialWidth +滾動條的寬度使用javascript的寬度，但滾動條的寬度在不同的瀏覽器不同，所以請不要嘗試，因爲它會導致兼容性問題。