Display: inline-block

[fghibellini]

issue shows up when you try to make a full screen stage.

the .kineticjs-content element has the css property display set to inline-block. When you try to set the stage the same size of the window there will always be some space under the .kineticjs-content element causing the display of scrollbars, because the inline-block element sits on the baseline of the container (this behaviour is needed for displaying font descenders).

quick-fix: add css rule .kineticjs-content { display: block !important; } or .kineticjs-content { vertical-align: top !important; } to your stylesheet

this is not really a bug but i was wondering why the .kineticjs-content element is displayed as inline-block, and i thought it should be noted somewhere becouse it took me quite a while to figure out where the extra space is coming from.

[chrisnicola]

Yeah ran into this too. Anyone want to comment on what the inline-block style is for?

[Wexcode]

Another quick fix would be to add font-size: 0 or line-height: 0 to the container you pass to the stage.

[jonathanazulay]

Can confirm this issue too (v5.1.0), my container is 5px higher than .kineticjs-content. line-height: 0 or setting .kineticjs-content to display: block works.

Also wondering why it has to be an inline-block?

[pronebird]

Can this be fixed on KineticJS side? I get scrollbars on fullscreen canvas.