I am having a difficult time customizing the Product name on the Product Information pages. Some of my names are longer than one line so I have increased the height but I am not able to get any of the titles (single or double-lined) to vertically align to the middle so it is "centered" in the colored bar.

In my CSS I have the following:

.productListing-rowheading, .productListing-rowheading, #productName { color: #ffffff; background-color: #1d5685; background-image: url("../images/bg_box_header.gif"); text-align: center; margin: 0; padding: 0.2em; height: 2.9em; vertical-align: middle }

It still looks like this:



What am I doing wrong?