Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • March 9, 2022 at 6:04 pm #1343881
    John

    Is there any way I can show social icons in portrait mode? On mobile, they appear in landscape only. Also, is there a way to reduce the logo size in mobile so it’s not right up against the black bar above it where the icons should be?

    March 9, 2022 at 8:30 pm #1343904
    Rikard

    Hi John,

    Please check if you have this CSS added in Quick CSS:

    @media only screen and (max-width: 769px) {
#top .social_bookmarks {
    display: none !important;
}
}

    If so, then please remove it, and replace it with this:

    @media only screen and (max-width: 767px) {
#top .social_bookmarks {
    display: block;
}
}

    Best regards,
    Rikard

    March 10, 2022 at 10:31 pm #1344061
    John

    Hello, I have added this into Quick CSS, but the social icons still aren’t showing on mobile in portrait.

    March 11, 2022 at 3:50 am #1344090
    Nikko

    Hi John,

    Can you try to use this CSS code and see if it helps:

    @media only screen and (max-width: 767px) {
  .responsive #top #wrap_all #header .social_bookmarks {
    display: block !important;
  }
}

    Best regards,
    Nikko

    March 21, 2022 at 2:33 pm #1345355
    John

    Hello, sorry I’m just following up on this. This works for the social icons, but the logo is still fairly large, especially on mobile. Is there any way to make the size smaller and have some white space above and below the logo?

    March 21, 2022 at 4:49 pm #1345366
    Rikard

    Hi,

    Thanks for the update. Please try this CSS as well:

    @media only screen and (max-width: 767px) {
.responsive .logo img, .responsive .logo svg {
    max-width: 65%;
}
}

    Best regards,
    Rikard

    March 22, 2022 at 3:16 pm #1345536
    John

    Thank you! Is there any way to add padding for the logo on desktop? When scrolling, the logo is smaller, but there’s no padding between the logo and other elements?

    March 22, 2022 at 7:17 pm #1345571
    Rikard

    Hi,

    Thanks for the update. Please try this CSS as well:

    .header-scrolled span.logo img, .header-scrolled-full span.logo img {
    max-height: 35px;
    margin-top: 5px;
}

    Best regards,
    Rikard

    March 24, 2022 at 4:24 pm #1345893
    John

    I tried this and it looks like the bottom of the logo gets cut off but there’s still no padding

    March 25, 2022 at 3:37 pm #1346017
    Rikard

    Hi,

    Please try this CSS instead:

    .header-scrolled span.logo img, .header-scrolled-full span.logo img {
    max-height: 35px !important;
    margin-top: 5px;
}

    Best regards,
    Rikard

    March 28, 2022 at 3:55 pm #1346323
    John

    That works. Thanks! You can close this.

    March 28, 2022 at 6:33 pm #1346338
    Rikard

    Hi,

    Great, I’m glad that you got it working. 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 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Social Icons don't appear in Portrait Mode on Mobile’ is closed to new replies.