can I use only landscape and portrait modes in media queries for responsive design

[mdavid]

Hi,
If all screens are either landscape or portrait is it enough to query (container or media) the orientation to achieve a responsive design?

 

[OldMan]

Not sure what you mean by "screens" -> If all screens are '''
It will be easier to answer your query if you provide the code or a link.

If you just try using the query. You should know the answer yourself.

 

[mdavid]

I understand that you think I'm being naive, but if I take 2 formats 1. mobile portrait mode where there's only 1 column and divs are stacked vertically. 2. mobile landscape mode where divs are arranged according to available space horizontally and vertically and this view is just enlarged as the device screen size increases. I think that this model could apply to a majority of websites.

 

[tomliv]

I think I get what you’re asking, but riddle me this. My iPad in portrait orientation is wider than your phone in landscape. Are you just going to scale up your stacked divs? That could get unwieldy. At some point - breakpoint - you are going to want to handle the layout of at least part of your page differently and most likely with a width-based media query.

Using media queries - CSS: Cascading Style Sheets | MDN

Media queries allow you to apply CSS styles depending on a device's media type (such as print vs. screen) or other features or characteristics such as screen resolution or orientation, aspect ratio, browser viewport width or height, user preferences such as preferring reduced motion, data usage...

developer.mozilla.org

 

[JosiahMaybe]

Yeah, I am with @tomliv, just orientation is not enough possibly. It may depend on your layout but by measured space is probably better. If you use percent or whatever of viewport a lot is a whole other story. Did you know commonly computers also have portrait and landscape modes? X E.