Setting results display for mobile in landscape

[kiwinode]

Hello,

Love your plugin (amazing work) – so thanks for that! I am using Isotopic results in my search and am wondering if there is some easy way to specify landscape vs. portrait parameters. For example, I have three rows and two columns for portrait (set through result width and rows count per page). I would like to set this differently for portrait (maybe one row and four columns). Any help you can provide would be greatly appreciated.

Cheers,
Nigel

[Ernest Marcinko]

Hi Nigel,

Well, there is no option for that, but with custom CSS you can change the column numbers, by specifying min-width attributes on certain resolutions:

[code]@media only screen and (max-width: 720px) {
.asp_r .item.asp_isotopic_item {
min-width: 45%;
}
}
@media only screen and (max-width: 480px) {
.asp_r .item.asp_isotopic_item {
min-width: 95%;
}
}[/code]

Basically, this code will force a one column layout on device width screen below (including) 480 pixels, and two columns on devices below 720 pixels.
The min-width attributes basically forces a minimal width for each item in the results. It is not set exactly to 50 and 100 percents, so that the script can calculate margins and paddings as well.

[kiwinode]

Thanks for that Ernest. Very helpful.

Cheers,
Nigel

[Ernest Marcinko]

You cannot access this content.

[kiwinode]

You cannot access this content.

[Ernest Marcinko]

You cannot access this content.

[Author]

Posts