How do I put boxes around my category images?

[Matt Smith]

Hi

I would like to have boxes around the category images on my homepage. Searched the forums for an answer but no luck. Can anyone help? Do I need to download an add-on or is there something I can do in css?

Thanks

Matt

[niccol]

In your stylesheet add the rule:

#indexHomeBody .categoryListBoxContents img{
border:2px solid red;
}

Obviously change the thickness and the color to whatever you want.

[Matt Smith]

Thanks.

But not sure exactly where in the stylesheet I should add this. Also for a certain colour can i use a hex colour number such as ffffcc.

Thanks a lot.

Matt

[niccol]

That rule you could put pretty much anywhere in the stylesheet! But at the bottom is always a good bet unless you can find something similar to group it with. (The order of the rules has a structure so if you can find it's correct place then all well and good. If not put it at the bottom.)

The rule would look like this:




Code:

#indexHomeBody .categoryListBoxContents img{
border:2px solid #ffffcc;
}

[Matt Smith]

Thanks so much for your help. Just one other query. How do I adjust the spacing between the category boxes. I would like to almost merge them together.

Thanks

Matt

[niccol]

Well, the boxes are cells in a table so you need to adjust how many cells you have in each row.

admin >> configuration >> maximum values >> Categories To List Per Row

[michellepchy]

Thanks for this it was just what I wanted too. But I would also like the box around my sub categories is this possible.

Thank you