Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • May 12, 2021 at 4:46 pm #1299961
    emilconsor

    Hi,

    is there a way to change the 767px Breakpoint to 820px?

    And just out of curiosity, why is the tablet breakpoint at 767px? Becaus most Devices are at 768px.

    Thank you in advance :)

    May 14, 2021 at 8:55 am #1300270
    Ismael

    Hey emilconsor,

    Thank you for the inquiry.

    You will have to override the existing css media queries and replace the max-width condition from 767px to the value that you prefer. That will require a lot of css modifications. Why do you need to change it to 820px? 767px is actually the mobile phone breakpoint. 768px to 989px to 1024px are the most common screen resolutions for tablets.

    // https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

    Best regards,
    Ismael

    May 14, 2021 at 1:35 pm #1300321
    emilconsor

    Hi Ismael,

    the masonry gallery on the “Leistungen”-Section or the “Referenzen”-Section has 4 columns at 768px but 2 columns at 767px.

    So basically i want them to be 2 columns from 820px to 480px.

    Thank you in advance

    Kind regards

    May 17, 2021 at 4:28 am #1300630
    Rikard

    Hi,

    Thanks for the clarification. Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (min-width: 480px) and (max-width: 820px) {
.responsive #top .av-masonry-entry {
    width: 49.90% !important;
}
}

    Best regards,
    Rikard

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.