equal boxes in the front page article

Iam trying to set up 4 boxes as shown and styled here: http://www.ka-mont.si/ but after couple days and trying to copy from the demo, I can not find how to equally line them up?
Thank you in advance

Hi,
you are using '.demo-typo-col12' class for those div's. So it means that their width will be 50% of container. If you want to have 4 div's each other you need to use '.demo-typo-col14' class. So width will be 25% of container and all your div's you will have in one line.

I want them in two columns like 4 boxes but they have some excessive padding in betweenthe top and the bottom boxes and I don know what causing that? please see attach...

Untitled-1.jpg

Try add this to override.css

Code: Select all

.lightbg .demo-typo-col2 .gkblock-2 {
padding-bottom:69.5px !important;
}


and remember to enable override.css option in template settings.

thank you this worked, but what if I want to narrow (make smaller) the padding between this 4 boxes? what should I add to the code?

Please add to override.css

Code: Select all

.lightbg .demo-typo-col2 .gkblock-2,
.lightbg .demo-typo-col2 .gkblock-5 {
    margin: 20px 0 !important;
}
.lightbg .demo-typo-col2 .demo-typo_padd {
    padding: 0 15px !important;
}


and decrease 20px and 15px to fit your needs.

Perfect, thank you very much!