jQuery Vertical Align

by Shannon Deminick 7. April 2009 05:09

UPDATED! (2009-04-29)

An easy way to vertical align elements with one line of code:

$('.innerText').VerticalAlign();  

I've removed the parameters as it turns out if you pass in a negative offset using padding, IE6 throws an error and JavaScript fails to continue executing. If you get the following error in IE6 debugging, it may be due to passing in a negative value to a padding css attribute, or similar:

  • invalid argument jquery J[G]=K

It's fairly easy to structure your html to not require a vertical align offset so it's really not needed anyways.

It also supports a couple of parameters:

  • offset = the number of pixels to offset the vertical alignment
  • usePadding = true/false. the default is false which uses a margin to align, if set to true, it uses padding
$('.innerText').VerticalAlign({offset:-20, usePadding:true})

Get the source:  VerticalAlign.zip (290.00 bytes)

Categories: JavaScript

Comments

2/1/2010 10:44:19 AM #

thanks Shannon, just made good use of this (it's #3 on Google for "jquery vertical align elements")

James Diacono Australia

3/24/2011 4:59:12 AM #

I'm working on the same plugin and you have the same issue as me, when you resize the browser, the images get smaller and won't restore back to the original size. I'm working on a solution! Will post if I develop one.

steadweb United Kingdom