website: responsive layout broken at 320px breakpoint

eBay / skin

Pure CSS framework designed & developed by eBay for a branded, e-commerce marketplace.

https://ebay.github.io/skin/

MIT License

176 stars 66 forks source link

website: responsive layout broken at 320px breakpoint #2235

Open ianmcburnie opened 7 months ago

ianmcburnie commented 7 months ago

I verified there's no existing issue for this bug.

[X] There are no existing issues

Current behavior

Looks like the website layout got broken and has introduced horizontal scrolling somewhere along the line. Possibly in some of the more complex layout examples like toggle button group.

Expected behavior

No response

Skin version

17.0.0

Device/OS/Browser info

No response

Steps to reproduce

1.
2.
3.
...

Relevant code block

No response

Additional context

No response

ArtBlue commented 7 months ago

We can verify this to be the case, but this may not be an issue. If I remember correctly, this may have been one of the drawbacks of the combination of having minimum button widths imposed and not being able to use container queries. I vaguely recall some compromises such as this, but we can verify.

ianmcburnie commented 7 months ago

We can verify this to be the case, but this may not be an issue. If I remember correctly, this may have been one of the drawbacks of the combination of having minimum button widths imposed and not being able to use container queries. I vaguely recall some compromises such as this, but we can verify.

I am just meaning that our Skin website itself shouldn't break at 320px. If you are saying this breakage is unavoidable/intentional then perhaps these layouts should be moved to a different page to avoid breaking the main skin page at 320. Feels like we need to demonstrate some kind of responsive solution though.