Docs

[Trung Nguyen]

Hi Themeco!

I am trying to make a grid based website white no gaps, but I am getting these random white space even after I set the padding to “0”

Thank you in advance!

[Prasant Rai]

Hello There,

Thanks for writing in!

Could you please provide us with your website URL so we can take a closer look?

Thanks.

[Trung Nguyen]

wwww.creativedesque.com

Homepage at the bottom

[Friech]

Hi There,

You can add this under Custom > CSS in the Customizer.

ul.margiless-grid, ul.margiless-grid li, ul.margiless-grid li img {margin: 0 !important;}
ul.margiless-grid li img {width: 100%;}

Hope it helps, Cheers!

[Trung Nguyen]

sorry, but that didn’t work

[Paul R]

Hi,

I would like to check but your site is in maintenance mode.

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

[Trung Nguyen]

This reply has been marked as private.

[Rue Nel]

Hello There,

Thanks for providing the access to your site. The code won’t work because the images are smaller that the column container or the block grid item container. Please add a more bigger images dimensions so that it will fit right up along its container. Please also keep in mind that the image element, the block grid element has a default bottom margin. To prevent or get rid of the margin, please edit your page in Cornerstone and insert the following custom css in the settings tab, Settings > Custom CSS

.x-block-grid-item img,
.x-column .x-img {
    margin-bottom: 0 !important;
}

I would highly recommend that you use a 3rd party plugin like TheGrid or Essential grid plugin. You can get this by going to X Addons > Extensions. For more information, please check it out here: https://community.theme.co/kb/integrated-plugins-the-grid/, https://community.theme.co/kb/integrated-plugins-essential-grid/

Hope this helps.

[Trung Nguyen]

Thank you!

I tried doing it with essential grid. it’s just a little overwhelming with all the functionality. I have also looked around and can’t seem to figure out how to do the same layout as above.

[Rad]

Hi there,

You can start with EG’s skin builder then grid settings (columns, spacing, gap).

https://www.themepunch.com/essgrid-doc/core-anatomy-of-an-essential-grid/#grid-layout, https://www.themepunch.com/essgrid-doc/item-skin-editor/

You’ll need a mixed of both X’s section/columns and EG for overlapping rows. This may be harder to start with but easier to manage in the long run. Maintenance is easier to do.

Thanks!

[Author]

Posts