Calculate height of div based on element height, for mobile

[domainatrix]

I have a rotating carousel of images posted above descriptions.Each description is a different length.

Currently the carousel shows all of one image and description, plus the top of the next, when you view the site on a mobile device, or at any screen resolution lower than 768px wide.

I want the height of the div that holds the carousel to be the height of the view screen, minus 5% padding top and bottom. And I would like the next item in the carousel to be hidden.

I’m not sure this makes a ton of sense but if you look at the Flavor carousel on my page, and then shrink the page to a width of 767px, you can see where the image shows.

My site is GelatiMoto.com

Thanks!

[rafaeljuarez]

there is a bug in mobile browsers. when you use 100% height , it will be the 100% of the document, not the viewport.

[Author]

Posts