Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #533702

    How could you make a grid cell that displays on the desktop disappear rather than stacking when the browser is pulled down to a smaller width. This site does exactly what I want my site to do: http://www.der-prinz.de/ My site is set up with grid rows with 2 cells. One has a text block and the other has a picture. I want the cell with the picture to disappear on mobile so only the cell with text displays. What’s the best way to do this?

    #533736

    Hey centralcreative!

    What id your level of CSS? You can use some media queries, to hide elements on mobile.
    here is an example:
    https://css-tricks.com/forums/topic/mobile-device-trick/

    which you can study and understand how it is done.

    Regards,
    Basilis

    #534351

    Thanks! Figured it out.
    I added this code to my php so I could assign a custom css class to individual elements:

    add_theme_support(‘avia_template_builder_custom_css’);

    Then added this code in the quick css box after assigning classes to the 3 elements I wanted to shrink:

    @media screen and (max-width: 800px) {
    .yourclass {
    display: none !important;
    }
    }

Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Make Specific Grid Cells Disappear Rather Than Stack in Mobile’ is closed to new replies.