vanilla-framework icon indicating copy to clipboard operation
vanilla-framework copied to clipboard

Published 20 hours ago • verified publisher icon canonical

The grid is broken between media queries

Open lyubomir-popov opened this issue 2 years ago • 7 comments

THere are some -1px in media queries (not sure when that got introduced) that I believe are breaking the grid. E.g.: image

lyubomir-popov avatar Oct 17 '22 08:10 lyubomir-popov

@lyubomir-popov what is the example you are trying it with?

I think it seems to be working as expected here: https://vanillaframework.io/docs/examples/patterns/grid/responsive

image

bartaz avatar Oct 17 '22 09:10 bartaz

Precisely that example^. See the cascade at +1 and -1 and then at 619 px: This is chrome, when I resize without the responsive screens toggle, it gives me 619.33 - and that's when it happens. Maybe just a chrome /high dpi bug? image image image

lyubomir-popov avatar Oct 17 '22 09:10 lyubomir-popov

For more context. This seems to be working fine on MacOS.

It seems to happen on Ubuntu and Windows (possibly may depend on the screen pixel density as well).

bartaz avatar Oct 17 '22 09:10 bartaz

I'm not quite sure if I'm missing something, but I'm not able to recreate this bug on ubuntu. Both Chrome and Firefox seem to work as expected: Screenshot from 2022-10-18 14-10-03 Screenshot from 2022-10-18 14-03-01

mtruj013 avatar Oct 18 '22 12:10 mtruj013

@mtruj013 what os are you using?

lyubomir-popov avatar Oct 18 '22 13:10 lyubomir-popov

@lyubomir-popov Ubuntu 22.04.1 LTS

mtruj013 avatar Oct 18 '22 14:10 mtruj013

Seems this depends not only on OS (Ubuntu) but also on the screen/display device (pixel density?).

bartaz avatar Oct 18 '22 19:10 bartaz