100% width based on orientation

[bravo14]

Hi Guys

 

I am using media queries to set a different CSS if a mobile device.  I am using 100% width on certain containers but the styling is using 100% based on the landscape orientation and not whichever way the device is being displayed.

 

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>

 

.slicknav_menu{

visibility:visible;

position:fixed;

top:0;

width:100%;

z-index:100;

}

 

as mentioned, this uses the landscape width even if the site is being displayed in portrait.

 

How can I fix this?

[wright67uk]

You could try;

 

Width: 100vw; instead of 100%