Question

I have X amount of divs, all set to a specific height and width. Within these is an image, all vary in size. I want to find the height of the image, divide it by 2 and set that as the margin top value so all images are in the centre if this makes sense? Ive tried making a fiddle only im unsure how to go about it…

http://jsfiddle.net/R8QUL/1/

Answer 1

You could do something like this

$(document).ready(function() {

    $('.box img').each(function() {
        var $this = $(this);
        var parentHeight = $this.parent().height();
        var thisHeight = $this.height();
        var topmargin = (parentHeight - thisHeight) / 2;
        $this.css("margin-top", topmargin);
    });
})

Fiddle here http://jsfiddle.net/R8QUL/6/