Increasing categories height in front page

[WebDoctor]

Hello,

 

I am designing my first Prestashop template.

I changed category align from vertical to horizontal in front page.

However distance from between categories and new division (tabs in my case) does not increase so Category and Tab divisions now overlap.

 

How increace heigh of Category division ?
I tried to modify category.tpl

height="{$categorySize.height}"   by multiplying this value.

However this does not effect front page (but affects inner page).

 

Website is buiding on address

http://hcentras.w7.lt/index.php

 

Thanks,

WebDoctor

[vekia]

hello

 

this is how it looks like for me:

 

so I suppose that you changed height?

[WebDoctor]

Hi vekia,

 

Yes I changed with CSS modifying ID #categories_block_left 

However Category division now overlaps with Tag division. I need to increase distance between divisions.

What more I need to modify ?

[NemoPS]

Try adding a clearfix to the categories block, and a clear: both to the tags block

[vekia]

#categories_block_left li {

border-bottom: 2px solid #ccc;

font-size: 18px;

text-transform: uppercase;

color: #000;

background: green;

display: block;

float: left;

padding: 0px auto;

margin-bottom: 10px;

height: 525px;

width: 220px;

border-radius: 15px;

margin-right: 10px;

margin-top: 15px;

text-align: center;

}

 

but there is height:525px; defined, so what about that? why this css style command is there?

this causing everything

[WebDoctor]

Hi Nemo1,

 

I added to file blockcategories.tpl

 

<!-- Block categories module -->
<div id="categories_block_left" class="block clearfix">

 

No effect

 

Then added this text to global.css

 

#tags_block_left{
    clear: both;
}

 

BINGO !

It works !

 

Thank you !

 

 

Try adding a clearfix to the categories block, and a clear: both to the tags block

[WebDoctor]

Hi Vekia,

 

Thank you for your answer.

I need this block to this height of 525px as I will need to attached images. So height needs to fit images.

 

 

 

#categories_block_left li {

border-bottom: 2px solid #ccc;

font-size: 18px;

text-transform: uppercase;

color: #000;

background: green;

display: block;

float: left;

padding: 0px auto;

margin-bottom: 10px;

height: 525px;

width: 220px;

border-radius: 15px;

margin-right: 10px;

margin-top: 15px;

text-align: center;

}

 

but there is height:525px; defined, so what about that? why this css style command is there?

this causing everything

 

[vekia]

ahh now i understand thank you for information and confirmation that Nemo's solution works for you

with regards,

Milos