Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • January 10, 2019 at 1:05 am #1052139
    aussiedropbear

    Hello,

    I am wondering if it was possible to reduce the spacing of the icon grid when viewed on mobile?

    In the link below, home page, there is a section named ‘Services’ that uses the icon grid. On the ‘Services’ Page there is a section names ‘Financial Products’.

    When viewing both of these pages on the mobile the spacing of the elements for the icon grid is quite large between the icon/heading and its content for that heading as well as between all the other icon sections shown.

    Is there a setting or some Quick CSS that may assist in reducing this?

    Many thanks
    John

    January 12, 2019 at 2:58 pm #1053105
    Basilis

    Hey John,

    Sure, you need media queries to achieve that.
    Here is how you can target something only on mobile!

    https://gist.github.com/gokulkrishh/242e68d1ee94ad05f488

    Best regards,
    Basilis

    January 12, 2019 at 11:34 pm #1053249
    aussiedropbear
    This reply has been marked as private.
    January 14, 2019 at 2:29 pm #1053684
    Victoria

    Hi John,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    


@media only screen and (max-width: 767px) {
  .avia-icongrid-flipbox li .avia-icongrid-front .avia-icongrid-inner,
  .avia-icongrid-flipbox li .avia-icongrid-front .avia-icongrid-inner, 
  .avia-icongrid-flipbox li .avia-icongrid-flipback .avia-icongrid-inner {
      padding: 1em 1em;
  }
  .avia-icongrid-flipbox li article {
    min-height: 200px !important;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    January 15, 2019 at 1:55 am #1053907
    aussiedropbear

    You are a champion Victoria!

    Mmany thanks :)

    John

    January 15, 2019 at 10:17 am #1054038
    Günter

    Hi,

    Glad we could help you.

    Enjoy the theme and feel free to come back if you need further assistance.

    Best regards,
    Günter

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘icon grid spacing on mobile view’ is closed to new replies.