Category image and category name text align problem.

[marknew]

Hi, I am trying to get the category name to align centered to the category image on my category listing page - here

http://jurassiclures.com.au/index.ph...=index&cPath=1

I want them to look the same as i have them on the product info pages

http://jurassiclures.com.au/index.ph...&products_id=9

It uses <div id="categoryImgListing" class="categoryImg"><?php echo zen_image(DIR_WS_IMAGES . $categories_image, '', SUBCATEGORY_IMAGE_TOP_WIDTH, SUBCATEGORY_IMAGE_TOP_HEIGHT); ?></div>

Anyone know how to fix this one?

Thanks

[dbltoe]

Well, first of all, it got listed in the css as div.categoryImg versus .categoryImg.
You will probably need to add .categoryImg img to the css to control the image and the text differently.
You are aware that not everybody has the bangers font installed on there machine. This could affect the look no matter what you do.

Also, you seem to have built your template by editing files in the classic folders. This will come back to haunt you on upgrade. The classic is there to not only show what a basic cart looks like but, also, it gives a safety net you can use to test your cart if you have problems down the road. The template_default files are used if files of the same name are not found in the custom template. Classic and default aren't really designed to "talk" to each other as you are doing. It's not a huge project to correct that, but it WILL be a huge project at upgrade time.

[marknew]

Thanks, yeh I know I'll need to sort the templates out but I inherited this and need to get it up quickly. I'll come back later and sort the templates. Bangers is a google web font and so doesn't need to be installed on the users machine.

I have this in my css. Are you saying it needs something else?


.categoryImg {
font-size: 3.6em;
color: #0f70a8;
align: middle;
font-family: bangers;

}

[dbltoe]

That only controls the text. If you want to control the text and the image, you'll need to add the .categoryIMG img call which will control the images in the .categroyIMG area.

[marknew]

OK thanks. So i need to add this?
.categoryIMG img {

}

[marknew]

What would I need to add to .categoryIMG img so the text and image aligns?