leif/lexys-labyrinth
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix editor canvas centering in Chrome

Browse Source
This commit is contained in:
Eevee (Evelyn Woods) 2020-12-03 21:19:33 -07:00
parent 700d3898ab
commit 7a710ee5dc
1 changed files with 3 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
style.css
View File

@ -944,15 +944,16 @@ main.--has-demo .demo-controls {
overflow: auto; overflow: auto;
/* Flex layout to center the canvas and overlay together */ /* Flex layout to center the canvas and overlay together */
display: flex; display: flex;
align-items: center; /* This isn't supported in Chrome (still!!), so use auto margins on the child instead
justify-content: center;
align-items: safe center; align-items: safe center;
justify-content: safe center; justify-content: safe center;
*/
background: #202020; background: #202020;
border: 0.125em solid black; border: 0.125em solid black;
} }
#editor .editor-canvas .-container { #editor .editor-canvas .-container {
position: relative; position: relative;
margin: auto;
/* Give the canvas/overlay a bit of a margin; it has to be a border because, due to some quirk /* Give the canvas/overlay a bit of a margin; it has to be a border because, due to some quirk
* of overflowing flexboxes I guess, padding and margins won't extend the scroll area on the * of overflowing flexboxes I guess, padding and margins won't extend the scroll area on the
* right and bottom */ * right and bottom */