Tagged: ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • August 24, 2018 at 7:28 pm #1001360
    Autostopowicz

    Hi

    Help needed…
    I am trying to set up a break point for three columns to make them appear one under another after specific screenwidth is reached (under 880px). Unfortunately there is no such option available in “edit column” window.

    Thanks in advance.

    • This topic was modified 6 years, 3 months ago by Autostopowicz.
    August 24, 2018 at 8:19 pm #1001388
    Vinay

    Hey Autostopowicz,

    Please perform the below steps:

    1. Enable “Show element options for developers” from Enfold theme options > Layout Builder.
    2. Add a color section element and give it a unique ID such as “breakpoint880”.
    3. Add 3 1/3 columns inside the color section and give it a custom class name such as “col”.
    4. Add the below CSS to your site.

     @media only screen and (max-width: 880px) { 
.responsive #top #wrap_all  #breakpoint880 .flex_column.col {
    margin: 0;
    margin-bottom: 20px;
    width: 100%;
}}

    Best regards,
    Vinay

    August 24, 2018 at 11:47 pm #1001436
    Autostopowicz

    Hi Vinay

    The color section as a fantastic element, but in my case it created additional spaces that I would have to get rid of using CSS. So I decided to use Your code without color section. And it works wery well.

    The topic can be closed.

    Thank You and have a good day.

    • This reply was modified 6 years, 3 months ago by Autostopowicz.
    August 25, 2018 at 8:33 am #1001524
    Rikard

    Hi,

    Great, glad we could help and thanks for the feedback. Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Three 1/3 columns break point’ is closed to new replies.