Hi folks,
How do i enable horizontal view for iPad? I cant find it!
Thanks
currently there is no landscape iPad media query. Using the container element in the desktop view will ensure all of your content is visible on a landscape iPad. You can also find information about altering the container width with different media queries here.
http://forum.webflow.com/t/activate-1200px-large-screen-media-query/611?u=davidn
Hi @Jokenpo, are you trying to show your site in ipad in horizontal view with the mobile menu shown? Anything over 992px is considered desktop mode, including ipad since it is 1024 px. You can use some custom media query to show or hide elements when the viewport gets to 1024:
<style>
@media (max-width: 1024px) {
... add css styles for elements when the screen is at ipad width
}
</style>
You put this code into the Header of your site, using custom code: Custom code in head and body tags | Webflow University. These styles will not show, until after the page is published.
I hope this helps 
Cheers, Dave
1 Like
Hi Dave
I think this is exactly what I am looking for. Whilst I am coming to grips with web flow, my CSS is a bit rusty. You mentioned above for the script that goes into the header tag “… add css styles for elements when the screen is at iPad width”
Can you confirm by looking at the link below what I would put in there to make the hamburger responsive nav load on iPad landscape?
https://preview.webflow.com/preview/arcadental?preview=1b1b6f023fc0fad0f15085a29498a749
Cheers
Jeremy
Hi @jeremy, my suggestion is to create a duplicate of your Navbar symbol, then give each symbol a unique ID. Make one symbol to show only on desktop, and the other on tablet and phone views. After doing that in the designer, go to Site Settings and click on the Custom Code tab and enter the style information below into the header:
<style>
@media (max-width: 1024px) {
#desktop-nav {display: none;}
#mobile-nav {display: block;}
}
</style>
Save changes and republish your site. I made a quick video as an example of what to do in the designer.
I hope this suggestion works/helps If not, let me know.
Cheers, Dave
Hi Davidn and Cyberdave. Thanks for your help. I will try to do it and posthere again.
Thanks a lot.
1 Like
this was very helpful @cyberdave
1 Like
Hi Cyberdave
Only just picked up this response. Thanks heaps for putting together this tutorial, it is exactly what I needed and will come in handy for future sites 
Regards
Jeremy
2 Likes
Hello,
I have followed the directions in the video and still my ipad landscape is behaving.
http://thaddeuswjohnson.webflow.io
Thank you for your help.
Ken
Hi @kennylj
Try using this code
<style>
@media (max-width: 1024px) {
#desktop-nav {display: none;}
#mobile-nav {display: block !important;}
}
</style>
Hello David,
Thank you for the quick reply.
I did make the requested changes and it still did not work.
I have attached 2 pics, one in portrait which looks good and the other in landscape.
Ken
If you could post your read only link I will be able to learn more.
From what I can see the nav is displaying correctly. What do you expect to see? If you want the menu to be an icon that opens when clicked you will have to use the settings panel for the mobile nav.
Hello David,
Here is my readonly link.
https://preview.webflow.com/preview/thaddeuswjohnson?preview=25efe8eb2d951bebec4ef5459995faaa
As you can see from the landscape photo, the header is not completely showing up like in the portrait one.There is whitespace above the header. I tried moving the header but it still shows the whitespace.
The site shows fine on all devices and modes except ipad landscape.
Thanks again.
Hello David,
I have decided to redo this site since I found some other issues.
Thanks
Ken
apart from the resized containers that we get when using the large screen media query (Activate 1200px “Large Screen” media query), is it possible to have 2 different style sheets, one for wide screen desktop, and one for “standard” screens and landscape tablets ?
I would like to have bigger sizes (text, images, etc) for large screens and smaller ones for standard screen sizes and landscape tablet.
Should I add a specific style sheet in the header ?
Thanks.
Currently, I don’t think so.
The tablet landscape issue is something I (and others) have mentioned to WebFlow in the past.
I know they have a lot of things on their plate… but I hope they address the issue…
not to mention the captcha, sub-folders, image upload, image-crop, ftp-upload, iOS end-display - issues.
Lots of issues - but the at least the core product is sweet.
1 Like
Hi @Michel, that media query is for large screen 1200 px and higher, but you can also create custom media queries for any size device, any size media query. Custom media queries work alongside the built in viewports and 960 grid system in Webflow.
Cheers, Dave
@cyberdave - how do you add / create custom media queries?
+1 MILLION! I would like to know too !
Here is an article about using Custom Media Queries, hopefully this will help: Introduction to CSS Media Queries | HTML Goodies