-1

I have a website wich you can only view on a horizontal way. But i don't know how to block it if it is vertical. I just can't figure out... Can anyone help me with this?

joske_saalfeld
  • 21
  • 5
  • 9
    Have you considered checking the screen resolution and seeing whether width or height is bigger? Also, why in the world would you create a horrible experience for someone that wants to use the site in portrait? – mason Jun 09 '14 at 19:58
  • because the mobile site is not totaly finished – joske_saalfeld Jun 09 '14 at 19:59
  • @joske_saalfeld that's not a compelling reason to do what you're asking. It sounds likely that the existing css is inflexible and not exactly responsive - maybe not even "appropriate". – AD7six Jun 09 '14 at 20:01

2 Answers2

3

You can do this in CSS by hiding/showing dependant on orientation

<style type="text/css">
    #warning-message { display: none; }
    @media only screen and (orientation:portrait){
        #wrapper { display:none; }
        #warning-message { display:block; }
    }
    @media only screen and (orientation:landscape){
        #warning-message { display:none; }
    }
</style>

....

<div id="wrapper">
    <!-- your html for your website -->
</div>
<div id="warning-message">
    this website is only viewable in landscape mode
</div>

SOURCE forcing web-site to show in landscape mode only

Community
  • 1
  • 1
Kevin Lynch
  • 24,427
  • 3
  • 36
  • 37
0

If I understand you correctly, this might help. I do suggest against it though, as there is currently isn't a very clean way to do it, and it can be user-unfriendly.

Curlystraw
  • 1