CSS Media Query Landscape - Keyboard Issue

505 views Asked by At

I tried in my mobile page

@media only screen and (orientation:landscape)
{
  /* My landscape based CSS here */
}

It's broken on keyboard opened.

After I tried;

@media only screen and (min-aspect-ratio: 13/9) {
/* Landscape */
}

Tested and works on;

Nexus 5,
iPhone 4,
iPhone 6,
iPhone 6+,
Samsung Note 4,
Samsung S3,
Samsung S4,
Samsung S5,
but it is still broken on when keyboard opened on
Nexus 4.

I couldn't find any global solution with CSS. Any help will be much appriciated. Thanks

1

There are 1 answers

0
engincancan On

I didn't came up with and straight answer but hacked out Nexus 4.

@media only screen and (width: 384px) and (height:233px) {
    /*my landscape div sets out display:none on nexus 4*/
}