Padding between marginless columns

Hi Guys,

I’m hoping you can help me with something with the site:

Under the video the homepage there is a red and grey box. I need those two boxes to remain the same size relative to each other. while the text resizes inside. The only way I can get them to stay the same size in height is to create a row with a marginless columns inside.

Now, I would like to have a 20px gap between the red and the grey boxes? When I apply padding, the padding is the same colour as the boxes (which are columns with a background colour)

Would you have any suggestions?

This is the effect I’m looking to achieve, where the background shape of the boxes can be controlled but the text resize inside without altering the shape of the boxes.

Hi There,

This code snippet will help you achieve that:

With that code, no need to use MARGINLESS column.

Hope this helps.

Thank you so much for sending that on, but can I ask you a couple of stupid questions?

So, where actually do I put that code? Also, I have other pages throughout the site that I don’t want the columns to be of the same height, just those two text boxes. Would I assign a class or ID to them?

Also, the maginless columns allow me to control the white borders around the elements to maintain the tight grid I have around the rest of the images.

Is there anyway I can assign a class/id to the those two columns, and have the padding/margin actually in a specific colour (like white) with CSS?

Hey There,

Thanks for updating in!

You will have to place the code in the Cornerstone’s page Custom JS and insert the js code.

You can always insert a custom column ID or class. In your column settings, find the “Customize” tab and there you can find the fields.

Hope this helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.