Grow your CSS skills. Land your dream job.

Vertically center an img adjacent to text – minus margin query

  • # January 25, 2013 at 5:59 am

    I often use this method to keep an image vertically centered along side some text. I was wondering if there are any alternative ways to do this, the minus margin-top value does not sit well with me, plus if the image size changes the pixel value must be calucated again as margin-top: -50%; doesn’t work correctly (probarbly due to my lack of knowlege on vertical height with percentages).

    note: the main reason for this method is if more text is added, the img remains vertically centered.

    http://codepen.io/dntz/pen/trJDy

    Thanks in advance.

    # January 25, 2013 at 6:16 am

    A little extra mark-up but: http://codepen.io/anon/pen/aAuoj

    # January 25, 2013 at 9:11 am

    thanks for that Paulie, would that be the optimal way to preform this task?

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".