'and' keyword not supported by library. about vue-component-media-queries

[CyberAP]

Could you give an example please? It seems to work just fine for me.

[Abdo-461]

I am developing using Nuxt Js and in the <style> tag, I am trying to write a media query. A media query with a single parameter works just fine and I am able to view it for that specific screen size, but then, when I want to put 2 parameters and use the 'and' keyword, the media query itself stops working. I know that because when when I am testing on a mobile browser, the styles gets all haywire removing the 'and' part of they query reverts the views back to how it was.
When I inspect the element, without the 'and' keyword, I could see the specific style for the specific elements, on a specific device screen size. With the 'and' keyword, it just shows the default CSS.

Check out the screen shot, whatever before the 'and' works perfectly, when using 'and', none of these parameters, before or after takes effect.

[CyberAP]

Can you show how you're using the library please? It doesn't work with CSS in any shape or form, it's for programmatic control (JS) only.

[Abdo-461]

The screenshot shows exactly how I use it. In Nuxt Js, there is the <style> tag.

<style> @media query(....){ //css here } </style>

It works well in the format described.

[CyberAP]

This library is unrelated to how you write CSS, you should only use it if you need JS code to know about media queries.

[Abdo-461]

Thank you for your reply.