Product Style

[Jordin]

Can someone please tell me what I would have to add to my stylesheet to get the products to have a nice border around them like at this zen cart shop: http://www.zen-cafe.com/store/index....=index&cPath=9

I have searched in the tutorials and on google but I can't find any information on how to do this.

It is probably somewhere but I dont know what key words to search for because im new to this stuff.

Thanks,

Jordin

[dbltoe]

A whole bunch of div's, a lot of images, and a lot of css add-ons.

Get firefox with the firebug add-on. Use the Inspect in firebug to see what they did.

Personally, I would have used a background image if the space is static in size.

[misty]

Try
http://www.zen-cart.com/forum/showth...t=50800&page=2

[Jordin]

Sorry, I think I might have asked for the wrong thing.

What I want to do is add borders like they have done at http://www.zen-cafe.com/store/index....=index&cPath=9 to the products on my site HERE

See how there is no style to the products on my site and the product pictures touch each other. I would like to add a border around each product so it looks more professional.

What would I have to add to the stylesheet to do that?

[dbltoe]

If all you want is spacing, add the following to the bottom of your includes/templates/PRU_Unique/css/stylesheet.css.

#productListing-odd, #productListing-even {
margin-top: 5px;
}

Adjust the 5px as needed.

[Jordin]

I added that to my style sheet like you said but it doesn't change anything. Do you have any idea why this wont work for me?

Thanks,

Jordin

[tony_sar]

well, those are classes and not div id's
so should be like this

.productListing-odd, .productListing-even {
margin-top: 5px;
}

[tony_sar]

I guess is better off to use the following code in your stylesheet .


.productListing-data{
padding-bottom: 0.3em;
}

this should give space between your listings

[Jordin]

Your help is very much appreciated. That worked perfect!

Could you tell me what I would have to add in the stylesheet to make a simple 1px border around the products also.

Many Thanks,

Jordin

[gjh42]

.productListing-odd, .productListing-even {
border: 1px solid #aabbcc;
margin-top: 5px;
}