White lines between columns?

How do I get vertical white lines between columns? Screen shots show what I have and what I would like. I’m using Integrity Light with a child theme and editing with Cornerstone.

Hey,

You will need to add a custom class for the section VET Facts and add the border-right like that:

  border-right: solid 4px #fff !important;
}
.YourCustomClass .x-column:last-child{
 border-right: none !important;
}```

Thank you that worked, however the lines don’t go right to the bottom of the column. How do I do that?

Hello There,

Thanks for writing in! To resolve your issue, please do the following:
1.) Please have the code updated and make use of this code instead:

@media(min-with: 980px){
  .YouCustomClass .x-column {
    border-right: solid 4px #fff !important;
  }

  .YourCustomClass .x-column:last-child{
    border-right: none !important;
  }
}

2.) Please go to your row container settings and enable the “Marginless Columns” option.
3.) Please remove the bottom padding in the row container settings.
4.) It would be necessary that you add a padding for each of the columns so that the lines will not be close to the contents inside the columns.

Hope this helps. Please let us know how it goes.

Hi RueNel. That didn’t work.

Also when viewing the page in Cornerstone it always looks as above. However when viewing the page in browser the 3 columns change to two and the text is shifted with this as shown below.

How do I fix this?
thanks.

Hi there,

Hmm, looks like there is inconsistency the way it’s displayed. It could be due to internal cache like transients. Would you mind providing your login credentials in a secure note? I like to check what you’re seeing in cornerstone.

Thanks!