Media queries in Lit html components?

[Chait Pinnamaneni]

I have been using JavaScript to listen to resize events on the window and toggling CSS classes to achieve the same results as media queries because they don't work in DevTools. Is there any formal guidance of using media queries in Lit html components or is the same as in non-Lit html components?

Regards,

Chait.

[Jack Franklin]

Hi Chait,

Good question! We've found that using ResizeObserver to track and react to changes, and apply CSS classes, is the best way currently. We are also considering building a small utility service to make this easier (as it's easy to forget and use window.innerWidth or a media query). 

I'm also hopeful that CSS Container Queries might help us here in the future but I've yet to experiment with those within DevTools.

Jack.