How to make align images top and show captions on top?

Question

How do I make all images align to top, not the middle? Also how do I adjust the position of the caption? For example to align it to the top left corner.

Answer 1

The images are center aligned by CSS with the !important Flag asigned.

you could either:

• donwload a developement version, and change the css,
• Apply a new css after loading the fotorama.css, also use the important flag
• overwrite the css rule with javascript with the style.setProperty method (note, you have to use this method on every image using the fotorama api $(".fotorama").on("fotorama:show",function(){......})

the caption can be easily modified just by css with the class fotorama__caption - for example:

.fotorama__caption{
  top:1%;
  left: 2%;
  font-size: 200%;
}