Cloumn break points custiomized

I would like to know if it’s possible to customize the column break points on a specific page of my site. I’ve seen other posts about changing the break points but the CSS doesn’t quite fit what I’m trying to do, or at least isn’t working on my site. I would like the break points to start sooner. I have four columns that I would like to go to two at 979px and stay at two until 481px, when they switch to one at 480px+under. If there is a way to get it to go to three without looking weird, that would be awesome, but I’ll settle for two. Thanks!

Hello There,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL of the page in questioned. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

If you do not want to share the url in the forum, please post it in a secure note. To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Regards.

Thank you, I’ve added a secure note to my original inquiry containing the url.

Hello There,

Thanks for providing the url of the page.

To resolve your issue, please edit your page back in Cornerstone and insert the following custom css in the settings tab, Settings > Custom CSS

@media (min-width: 481px) and (max-width: 979px){
  .e552-21.x-section .x-container.marginless-columns>.x-column.x-1-4 {
    width: 50% !important;
    display: block;
    float: left;
    margin: 0 auto !important;
  }
}

We would loved to know if this has work for you. Thank you.

Yes! It worked! Thank you!

You’re welcome.

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