Each Vue
component has the $scrollBarSize
property that contains 2 numbers: {width: w, height: h}
that correspond to the width and height of respectively vertical and horizontal scrollbars.
Also, some CSS classes are made available globally:
width100lessSB
andheight100lessSB
that will givecalc( 100% - **px )
to fit the whole parent' width/height like if a scrollbar was shown.paddingSBright
andpaddingSBbottom
define apadding-right
(resp.padding-bottom
) in pixels of the scrollbar size
It could be made reactive for when the user changes the zoom/resolution/...