CSS vertical align icon next to block of text inside cell

Question

I thought this was gonna be a simple verical-align:middle situation but I can't seem to make that work. Maybe i am missing something on a parent element.

Here is a JSfiddle with a visual of my issue: http://jsfiddle.net/5QFAw/

I am trying to vertically align the "remove" x's next each th b in the middle.

Im stumped. Ideas?

Answer 1

What you think about this? //jsfiddle.net/5QFAw/2/

Obvious you will need to move those inline styles to the stylesheet

Answer 2

If the height of the row is unknown or not fixed, then your best bet is to put the "X" into another td . Like this: http://jsfiddle.net/5QFAw/3/