user1333018
user1333018

Reputation: 81

dealing with images of varying heights for twitter bootstrap carousel and link for images in carousel

What is the most effective way to deal with images of varying heights?

a) I have many images and several of them are taller than the rest. I'd like to make them restricted to the area of the carousel. But, if I define the carousel dimensions explicitly (like .carousel { width: 500px; height: 500px; } ) then I lose the auto-resizing that bootstrap does, which is crucial for making the site look good on mobile sites.

b) Is is possible to provide hyperlink/link for images in twitter bootstrap?

Anyone know how?

Upvotes: 3

Views: 2287

Answers (2)

kjg61pt
kjg61pt

Reputation: 116

img { width: 100%; } on the image and #carousel_container_id_here { max-height: XXXpx; overflow-y: hidden; }

Note that it will clip the images that exceed the max-height.

Upvotes: 2

Salman
Salman

Reputation: 3726

I think you can just specify max-height e.g. .carousel { max-height: 500px; }. That way, re-sizing should work and the design won't break either.

Upvotes: 0

Related Questions