Bootstrap - hide element on portrait orientation and show on landscape

Question

I want to hide images on mobile devices in portrait orientation but show on landscape.

How it is possible with Bootstrap ?

Thanks :)

Answer 1

Bootstrap don't have orientation based classes. But you can simply write them yourself using media queries in css.

@media (orientation:landscape) {
    .hide-on-landscape {
        display: none;
    }
}

@media (orientation:portrait) {
    .hide-on-portrait {
        display: none;
    }
}