center align the bottom I, bottom II, bottom III, bottom IV

[Rittick]

i want to have a detailed bottom , displaying some website information but the bottom modules are left aligned which looks odd. I want them to center align but it isnt working...

[dziudek]

In general it is possible only when you disable the masonry effect in the bottom section, specify max-width for the #gkBottom element and specify the percent widths for the elements inside the bottom modules.

To disable the masonry effect please remove this code:

if(document.id('gkBottom')) {
        document.id('gkBottom').masonry({ 
            columnWidth: ".($this->API->get('layout_grid_base', 320) / 2.0)."
        });
    }\n

from the layouts/blocks/head.php file.

And please add following rules in the template.css file

#gkBottom { max-width: 1000px; }
#gkBottom .box { width: 25%; }

for the tablet.css file please add:

#gkBottom .box { width: 50%; }

for the mobile.css please add:

#gkBottom .box { width: 100%; }