Morten Hagh
Morten Hagh

Reputation: 2113

image height based on mobile orientation

I have a problem with a small mobile image gallery. When I change the orientation to portrait the images are too large to be displayed on the screen.

Is it possible with some javascript to make images fit the screen when the orientation changes to portrait?
In landscape mode, everything looks fine.

Upvotes: 2

Views: 618

Answers (2)

codef0rmer
codef0rmer

Reputation: 10530

Try this:

@media screen and (orientation:portrait) {
    //your css code goes here
}

@media screen and (orientation:landscape) {
    //your css code goes here
}

Upvotes: 0

Ram
Ram

Reputation: 144689

yes, you can use CSS3 Media Queries without using JavaScript.

@media screen and (max-width: 450px) {
    img {
        width: 30%;
    }
}

http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

Upvotes: 1

Related Questions