removed right column, few more things, block_header_large.gif and products details page full fill empty space where right column was

[originals]

Hello, prestaforum

Im almost done with my site. Few things left. I really hope someone can help me with these questions.

I managed to remove the right column on the standard prestashop theme.

Then i managed to make it show 5 products on a row instead of 4.

Then i again managed to make the featured products on home wider to 750 px see the results.

problem 1:
The things is the top shade, tab, where normaly the text Featured products is doesnt go over the 5th product.
It stops at product numer 4 see the first arrow.

How can i make it extend to the 5th product aka 750px?

Above problem solved.

problem 2:
With that i keep a little bit of unused space to the right in the home featured. How can i make the 5 products make use of the full 750 px width ? so i dont end up with the unused little space to the right of the last product? see attached pictures.

problem 3:
And my last problem is , by making the above adjustments i ended up with an anused space to the right on my products detail page. see the attached picture. i want it to extend to the right so it fits the whole space. Right now i have an anused space where normaly the right column is, but since i removed the right column i kept the white empty space to the right on my products detail page. How can i make it use the full width of the products detail page.?

Im almost there need these few problems fixed and i can go live.

Thanks in advance for the help and answers
----------------------------------------------------------------------------------------------------------------------------------------
I found this post on the forum,

http://www.prestashop.com/forums/viewthread/41191

You can modify the following in the /* block in the center column */ section of css/global.css in your theme’s directory:


#center_column div.block h4 {
background: transparent url('../img/block_header_large.gif') no-repeat top left;
height: 17px;
color: white;
}
This code makes the header of all blocks in the center column use the block_header_large.gif image. You can change the background to none to remove the header background. You’ll need to change the color to black or another dark colour.

If you want to remove the header altogether, you can go to modules/homefeatured/homefeatured.tpl and {* comment out *} line 3
------------------------------------------------------------------------------------------------------------------------------------------

UPDATE:

ok i figured from the above post to resize : themes/prestashop/img/block_header_large.gif ftom 556px to 750px and it worked, the block header large now covers all 5 products. got the first problem fixed.!

but now my second and 3th problem. The unused space to the right. how can i get the 5 products to make use of the 750px width? now im still left with a bit of unused space see my 3th picture attachment.

And see seccond picture, how can i get the details product page to make use of the space left from removing the right column.?



Thanks in advance

[Pshopic]

Hi
To increase width of products edit global.css, line 972:

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

increase padding like that:

padding:0 10px;

if 10px is not enough increase it.

Answer 3:
width of columns depend on you. you may increase left or right columns width.
with line 1685, you may increase left column width;

#primary_block #pb-right-column {
float:left;
width:310px;
}

with line 1714, you may increase right column width:

#primary_block #pb-left-column {
float:left;
margin-left:1.1em;
width:233px;
}

[originals]

Hi
To increase width of products edit global.css, line 972:


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


padding:0 10px;
if 10px is not enough increase it

Hi there. Prestashopic , Thanks for this exxelent answer. it i have the padding on 8 and it fits perfectly in the 750 px width. Thanks for taking the effort for givving me an asnwer.

Im gonna check out your second solution now, I wanna make the empty space on the productsdetail page filled up with the picture price and so on make full use of the width of the page.

Again thank you

[originals]

It worked all your sollutions worked exactly what i wanted. thanks a bunch.

i made the right column 500 px and it filled up the right side.!

i can go live.!

Only 2 small problems that can hopefully be solved,

If you look at the pictures you see the cart at the left column.

The last 2 words of winkelwagen (cart in dutch) gets cut of. The e and n. I wanna make make it show fully. where can i fix the width of the cart text?

and the other thing is , :


Hi
To increase width of products edit global.css, line 972:


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


padding:0 10px;


Where can i change the height of the above products block cant find it. my cart text line gets cut of

See the attached picture.