Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • February 1, 2018 at 6:45 pm #906405
    kazzijazz

    Hiya, I’m pulling my hair out, I can’t find any solutions that work. The social icons appear perfectly on a desk top but disappear on a mobile. So appreciate help, many thanks

    February 1, 2018 at 6:51 pm #906408
    Jordan Shannon

    Hey kazzijazz,

    I logged in but was not able to view anything. Can you give us admin rights so we can access the pages?

    Best regards,
    Jordan Shannon

    February 2, 2018 at 10:18 am #906748
    kazzijazz
    This reply has been marked as private.
    February 3, 2018 at 5:57 am #907165
    Rikard

    Hi,

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

    @media only screen and (max-width: 989px) {
#header_meta .social_bookmarks {
    display: block !important;
}
}

    Best regards,
    Rikard

    February 3, 2018 at 5:55 pm #907256
    kazzijazz
    This reply has been marked as private.
    February 4, 2018 at 7:05 am #907378
    Rikard

    Hi,

    The phone number looks to be in the middle? Do you mean that you want the phone number and social icons on the same line?

    Best regards,
    Rikard

    February 4, 2018 at 9:26 am #907407
    kazzijazz
    This reply has been marked as private.
    February 4, 2018 at 11:52 am #907466
    Victoria

    Hi kazzijazz,

    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: 990px) {
  .responsive.html_mobile_menu_tablet .phone-info {
    float: right;
    width: 50%;
    clear: none;
    text-align: center;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    February 4, 2018 at 12:55 pm #907498
    kazzijazz
    This reply has been marked as private.
    February 5, 2018 at 5:35 am #907711
    Ismael

    Hi,

    Thank you for the info. Please add the following css code.

    @media only screen and (max-width: 767px) {
  .responsive .phone-info {
      float: none;
      width: 100%;
      clear: both;
      text-align: right;
      top: 0;
      position: absolute;
  }

  .responsive #header .social_bookmarks {
      padding-bottom: 2px;
      width: 100%;
      text-align: left;
      height: auto;
      line-height: 0.8em;
      margin: 0;
      padding-left: 0;
  }
}

    Best regards,
    Ismael

    February 6, 2018 at 2:09 pm #908592
    kazzijazz
    This reply has been marked as private.
    February 6, 2018 at 4:02 pm #908648
    Nikko

    Hi,

    Glad that Ismael helped you. Thanks for using Enfold :)

    Best regards,
    Nikko

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Social Icons disappearing on a mobile display in top bar at the right’ is closed to new replies.