Tagged: ,

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • May 16, 2022 at 7:22 pm #1351985
    advteksol

    The Special Header and Icon Box elements do not seem to be working on mobile for the website I’m working on. The Special Header goes vertical (see image here: https://imgur.com/pRMbRIi). Also, Icon Boxes are not showing the verbiage and are very spaced out (see here: https://imgur.com/ujGlikR).

    Thanks for your help in advance.

    May 17, 2022 at 4:59 am #1352017
    Nikko

    Hi advteksol,

    Thanks for giving us admin access, the reason for the issue is the large padding in left and right area of the column.
    To fix it, I have set your 1/1 Column to have a Custom CSS Class main-column
    Then in Enfold > General Styling > Quick CSS, I have added this code:

    @media only screen and (max-width:479px) {
    #top .main-column {
        padding: 0 !important;
    }
}

    Please review your site.

    Best regards,
    Nikko

    May 17, 2022 at 12:50 pm #1352068
    Guenni007

    But i would start earlier the way Nikko did – f.e. on 767px

    and maybe you decide to have on very small screens a different way to show those icons :

    @media only screen and (max-width:767px) {
    #top .main-column {
        padding: 0 !important;
    }
}

@media only screen and (max-width:479px) {
  .iconbox.enlarge-icons {
    display: flex;
  }

  .iconbox.iconbox_left_content.enlarge-icons {
    flex-flow: wrap row
  }

  .iconbox.iconbox_right_content.enlarge-icons {
    flex-flow: wrap row-reverse
  }

  .enlarge-icons .iconbox_icon {
    margin-right: 50px !important;
    margin-left: 0 !important;
    margin-top: 20px !important;
  }
}
    May 17, 2022 at 2:54 pm #1352093
    advteksol

    It looks great now! Thank you both for your help!

    May 17, 2022 at 6:00 pm #1352110
    Rikard

    Hi,

    Great, I’m glad that we could help you out. I’ll close this thread for now then, please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Mobile not working for Special Header & Icon Box’ is closed to new replies.