Large gap between photos and SOLD OUT

I attempted to fix this long ago but the suggestions did not work so I am revisiting this issue. I am moving all my sold out items into their own category. When I do this I remove the price. However when you look at a product listing the word sold out appears under it with a large amount of space. I would like to move this up by at least 75%.

Removing the price really has no affect, it shows up like this even if the price is shown too. This just does not look clean. I'm hoping for an easy fix. Please give specifics, don't assume I know much regarding code, I don't. I sort of stumble around and learn as I go.

Any help would be appreciated. Here is an example page:

http://www.polish potterystore.com/shopping/index.php?main_page=index&cPath=121_122_126

For that particular page start with this css rule at the bottom of stylesheet.css

#cat121_122_126Table br{
 display:none; 
}

That is specific to that category so you will have to insert similar rules for all the categories that you want to do this to.

You can just use the numbers out of the URL so this page is cPath=121_122_126 so that is why the rule is like that.

Isn't it possible to write something that automatically included all categories or would I have to write it for each category separately.

So:

do you want to do this for all categories?
do you want to do it for some categories ( ie the sold out categories ) ?

If you want to do it only for the sold out categories the way above is the best way for you to go. It uses some of the custom coding that you have already added.

If you want to do it fo all categories then get rid of that css rule and add this one:

.tabTable br{
display:none;
}

then you may or may not need to tidy up the layout a bit after that - dependent on your template.