<solved>featured products on homepage--how to increase the space between the product images

[clauf]

Currently, the distance between the product images are very small as the drawing above. I want to seperate them a bit more as the drawing below.

I want to keep the size of the images unchanged, so I need to increase the width of the block. How to achieve that?

Thanks.

[Martin Velikov]

Are you referring to the Featured Products on the front page? If yes, this won't work exactly as you imagine it should.

The featured products are just an unsorted list that includes an ajax module displaying the products in the boxes.

What you can do is edit the CSS for the template you are using.

Just open the global.css file. Then find the code that would look something like that:

#center_column .products_block ul li {
background-color:#D1E0EF;
border-bottom:1px solid white;
border-right:1px solid white;
clear:none;
float:left;
margin-top:0;
padding:0;
width:133px;
}

Then alter the "border-right" variable. For example:

border-right:15px solid white;

This will make the space between the products 15px instead of just 1.

Hope that helps.

[clauf]

Thank you, Martin. It worked! exactly what I want.

[FutureLED]

Thanks for that too.