Quantcast
Channel: Active questions tagged flexbox - Stack Overflow
Viewing all articles
Browse latest Browse all 1617

pixi.js application in "flex: 1" div grows vertically

$
0
0

On load, my pixi.js app fills the available space provided by the flex layout. But when I resize the window, the app starts grow vertically and I get a vertical scrollbar. How can I make the app respect the flex layout on resize, in the same way the div does if I comment out the parent.appendChild(app.canvas) line?

<!doctype html><html lang="en"><head><meta charset="utf-8"><style>    body { display: flex; flex-direction: column; height: 100vh; margin: 0; }    #pixi { flex: 1; }</style></head><body><p>top line</p><div id="pixi"></div><p>end line</p><script src="https://github.com/pixijs/pixijs/releases/download/v8.12.0/pixi.js"></script><script type="module">    const parent = document.getElementById('pixi')    const app = new PIXI.Application()    await app.init({ background: '#1099bb', resizeTo: parent })    parent.appendChild(app.canvas)</script></body></html>

Viewing all articles
Browse latest Browse all 1617

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>