Hello.

 

I'm using Bootstrap for the first time and are having a couple of issues with my accordion on http://worldofwinfield.co.uk/.

 

Firstly I am using images of different sizes and the only way I can think of to align them all is to set a min-height:

 

.thumbnail .caption {
padding: 9px;
color: #333;
min-height: 200px;
}

 

Is there a more elegant way? The problem being that I now have stretched images.

Also is there a way to align the buttons?

 

The final question is more tricky as I have set a canvas element as a background (something else new to me - canvas that is), and now the top two accordion rows do not work.

 

I might just scrap the canvas anyway as it is unnecessary but I want to understand why I have broken the accordion.

 

Any guidance greatly appreciated.

 

Thanks

James

 

There is two simple way:

 

1. create images more then container and set max-height.

2. jquery

var thumHeight = $(".thumbnail").height();

$(".thumbnail img").height(thumHeight/3);

jsfiddle

Edited September 3, 201511 yr by fleur