Columnize breakpoints

Hello, I have a section using a nested COLUMNIZE function within an ACCORDION. I can see that, as the screen is resized to mobile, the breakpoint forces the COLUMNIZE content into a single column.

I’m wondering how I can get more granular control over that through CSS. I’ve used the obvious inspector functions in browsers but cannot seem to drill down to the specific CSS that effects those columns.

Ideally, I’d like to break the content into 2 columns or 1 dependent on the screen size using the usual @media only screen CSS.

Thanks in advance.

Hi @dmuller,

Thanks for reaching out!

I check your website but I can’t create the right CSS selector as of the moment. Would you mind sharing your credentials so that we can take a look closer? To do that, please give us the following information in a Secure Note.

  • WordPress Login URL
  • Admin level username and password

You can find the Secure Note button at the bottom of your posts.

Thank you.

Sure… see below

Although, I think I fixed it…

@media only screen and (max-width: 762px){
.x-columnize {
-webkit-column-count: 1!important;
-moz-column-count: 1!important;
column-count: 1!important;
}
}

:slight_smile:

Hi @dmuller,

We’re glad that you’re able to figure it out! If you have any other concerns or clarifications regarding our theme features, feel free to open up a new thread.

Thank you.

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