Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • August 3, 2020 at 12:57 pm #1234817
    Eleina_Shinn

    Hi, on this site i have a grid row with 4 columns and I have given each column a top padding of 100px, mainly because I have an overlapping logo and I needed this row, #info – this is info in site navigation and the logo covered some of the info in first column – works great on desktop, but that padding doesn’t work on mobile, need it to be just 30px on mobile…

    grid row has an id of #info

    I tried making a 2nd grid row just for mobile, but then that navigation item “Info” doesn’t work on mobile, so I have to reduct the padding on mobile instead.

    • This topic was modified 4 years, 3 months ago by Eleina_Shinn.
    August 5, 2020 at 4:24 am #1235278
    Rikard

    Hey Eleina_Shinn,

    Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 767px) {
.home #info .av_one_fourth {
  padding-top: 30px !important;
}
}

    Best regards,
    Rikard

    August 5, 2020 at 2:29 pm #1235434
    Eleina_Shinn

    That’s perfect, thank you so much!

    August 5, 2020 at 11:02 pm #1235542
    Jordan Shannon

    Hi,

    I’m glad this was resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Grid Row – Differnet padding on mobile’ is closed to new replies.