I am working in a responsive layout, Working with mobile devices. Designed Adaptive Layout with to similar subjects side by side in Landscape.
In portrait, they are still side by side. Not what I want. How do I get this layout over and under when switching to portrait?
Landscape to Portrait mobile display
-
- New User
- Posts: 1
- Joined: Thu Jun 27, 2019 10:51 am
- First Name: John
- Last Name: Jurrius
- Company Name: Amports
- Phone: 4102451567
- State / Province: Maryland
- Zip / Postal Code: 21226
- Country: United States
- Contact:
- Megan
- Profound Logic Staff Member
- Posts: 90
- Joined: Mon Sep 11, 2017 12:15 pm
- First Name: Megan
- Last Name: Bond
- Company Name: Profound Logic
- Phone: 5623227473
- State / Province: California
- Zip / Postal Code: 92692
- Country: United States
- Contact:
Re: Landscape to Portrait mobile display
Hello John,
In the Responsive Layout Designer, in the top left corner, @media rulesets can be defined that will allow you to design the screen for particular screen sizes. In your particular case, you'd want to set a screen height in addition to the width so that it will detect a wide screen (landscape, width > height) or a tall screen (portrait, width < height). Alternatively, you can create your own @media rulesets in an external CSS file and use one of the many other @media detection options to detect the shift. Support for certain @media detection options may be limited so please be sure that your target browsers will support the options you choose.
To learn more about the responsive layout editor: https://core.profoundlogic.com/docs/dis ... ive+Layout
To learn more about the @media rulesets and their options: https://www.w3schools.com/cssref/css3_pr_mediaquery.asp
We hope this helps!
Thanks,
In the Responsive Layout Designer, in the top left corner, @media rulesets can be defined that will allow you to design the screen for particular screen sizes. In your particular case, you'd want to set a screen height in addition to the width so that it will detect a wide screen (landscape, width > height) or a tall screen (portrait, width < height). Alternatively, you can create your own @media rulesets in an external CSS file and use one of the many other @media detection options to detect the shift. Support for certain @media detection options may be limited so please be sure that your target browsers will support the options you choose.
To learn more about the responsive layout editor: https://core.profoundlogic.com/docs/dis ... ive+Layout
To learn more about the @media rulesets and their options: https://www.w3schools.com/cssref/css3_pr_mediaquery.asp
We hope this helps!
Thanks,
Who is online
Users browsing this forum: No registered users and 0 guests