Как да забраня сайт да се вижда в landscape при телефон?

[testkiwi]

Привет,
т.е. дори телефона да е обърнат в landscape сайта да е portrait ?
макар да е bootstrap просто не ме кефи заради спецификата на сайта, който е с много снимки и ако намаля колоните да са по 2 вместо по 1, не ме радва.

Поздрави.

 

[Sky]

От: Как да забраня сайт да се вижда в landscape при телефон?

Интересен въпрос. И аз съм имал подобно чудене и дано някой сподели решение.

 

[happyslacker]

От: Как да забраня сайт да се вижда в landscape при телефон?

Като обърнеш телефона в landscape би трябвало ширината на снимките да нараства, а не да се появява още една колона. Още една колона може да се появява на голям монитор.

Това става като си отвориш CSS файла и го редактираш (търси в кода @media).

 

[testkiwi]

От: Как да забраня сайт да се вижда в landscape при телефон?

Като обърнеш телефона в landscape би трябвало ширината на снимките да нараства, а не да се появява още една колона. Още една колона може да се появява на голям монитор.

Това става като си отвориш CSS файла и го редактираш (търси в кода @media).

да, прав си верно.

Иначе има някакви куци решения като описаните тук:
http://stackoverflow.com/questions/8738072/forcing-web-site-to-show-in-landscape-mode-only

Ама е много бъгаво, защото си личи, с обръщането на телефона за секунда се обръща и сайта и после се намества в нужното място с 90 градуса ама не си е работа. Изглежда лагаво, грозно и тъпо Tрябва да има по-хитър начин, изобщо да не се мърда..

 

[madseason]

От: Как да забраня сайт да се вижда в landscape при телефон?

Предлагат се доста идеи за решаване на този проблем. Лично на мен най-много ми допада този:

html, body {
  height: 100%;
}

@media screen and (orientation: portrait){
    html {
        -webkit-transform: translateY(-100%) rotate(90deg);    
        transform: translateY(-100%) rotate(90deg);
        -webkit-transform-origin: left bottom;    
        transform-origin: left bottom;    
    }
}

ДЕМО