孩子變形引起異常溢出滾動外觀？

爲什麼在這個例子中垂直滾動條的大小是雙倍的，而不是水平滾動條？孩子變形引起異常溢出滾動外觀？

<div style="width:200px; height: 200px; overflow:scroll"> 
    <div style="width: 400px; height: 400px; background-color:orange; transform: scale(.5, .5); -webkit-transform: scale(.5, .5); transform-origin: 0 0; -webkit-transform-origin: 0 0;"> 
    TEST TEXT 1 TEST TEXT 2 TEST TEXT 3 TEST TEXT 4 TEST TEXT 5 TEST TEXT 6 TEST TEXT 7 TEST TEXT 8 
    </div> 
</div>

enter image description here

的水平滾動應具有相同的比率作爲垂直滾動條。

就像在Chrome，safari和firefox中發生的那樣，我猜這種行爲是寫在一些標準的？這裏是一個小提琴： http://jsfiddle.net/v2xhj3kw/

來源

2014-10-06 jedierikb

你提到水平兩次在你的文章...請澄清你的意思是垂直... – Phlume 2014-10-06 15:14:25

盒模型被添加屬性的父元素

height: auto;

是導致高度的增加的特性。

來源

2014-10-06 17:34:25 fauverism

添加高度：自動到孩子完全刪除垂直滾動條 - 我試圖使水平滾動條具有相同的比例作爲垂直滾動條 – jedierikb 2014-10-06 17:59:00

孩子變形引起異常溢出滾動外觀？

回答

相關問題