Home Forums Community Forum Avada Breakpoints – Why do 4 columns break into 1 instated of 2 on tablet?

Only users with a registered purchase of Avada can post to the community forum. Please register your purchase here.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • freshinktechcoop
    Participant
    Post count: 10

    Hey all,

    I don’t understand why the breakpoints don’t go from 4 to 2, or from 6 to 3, is there a setting or some override people use for Avada?

    As for standard breakpoints, there are so many thoughts about the best way to do it, what do other people use? I’ve been using (probably way too granular):

    /* iPhone5 and small mobile devices */
    @media (max-width:320px) {
      
    }
    
    /* Mobile Down */
    @media (max-width:767px) {
      
    }
    
    /* Tablet Only */
    @media (min-device-width: 768px) and (max-device-width: 1024px) {
    
    }
    
    /* Tablet Down */
    
    @media (max-device-width: 1024px) {
      
      )
    
     /* Landscape Tabs & Others Only*/
    @media (min-width:1025px) and (max-device-width: 1199px)  {
    
    }
    
    /* Laptop / Desktop Up */
    @media (min-width:1200px) {
    
    }
    
    /* big screens */
    @media (min-width: 1601px) {
      
      }
    Caitlin Bauer
    Participant
    Post count: 6

    Totally agree! Any luck or progress with this? Seems pretty standard…

    marklchaves
    Participant
    Post count: 675

    It’s a shame no one’s replied to @freshinkstudios earlier. I see so many posts from 2018 go completely unanswered.

    Anyway. Caitlin, I don’t personally override breakpoints for column layouts. But, I mocked-up a quick solution for someone who posted about this same topic recently.

    Here’s a live demo of where I override 3 columns (can be four or more) to 1 column (Avada standard) to go from 3 columns to 2 columns.

    https://codepen.io/marklchaves/pen/MWWWVRW

    Not sure if this helps.

    Good luck

    szmigieldesign
    Participant
    Post count: 1

    While I’m really happy to see latest features like dynamic content being implemented to Avada, I still believe it’s biggest pet peeve is dated grid system using simple “display: block;” elements with clearfixes, etc.

    Therefore I think that to really fix the responsive grid issues (and make it more user friendly), Avada would have to introduce a fresh flexbox based and CSS grid based approach. CSS grid would be something totally awesome, but hard to implement considering current user base (a legacy mode with legacy grid would have to be used for old sites). However, implementing flexbox instead seems doable and would allow for better grid flexibility and positioning.

    I wonder if any of this is being planned in near future?

Viewing 4 posts - 1 through 4 (of 4 total)
Only users with a registered purchase of Avada can post to the community forum. Please register your purchase here.