Tagged: ,

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • November 15, 2016 at 8:38 pm #712579
    team_ubermedia

    I can’t seem to get the social icons to display correctly on my site when viewing on small screens. This is the code I was using which displays the icons on the next line but the twitter icon disappears:

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

  .responsive #header .social_bookmarks {
    display: block!important;
    position: absolute !important;
  }
}

    It would be ideal to shrink down the logo so the logos can be displayed next to the menu icon. Or if it has to be on the second line, be centered so they don’t disappear.

    November 15, 2016 at 10:13 pm #712639
    Andy

    Hey team_ubermedia,

    try this code:

    @media only screen and (max-width: 767px) {
.responsive.html_header_top #header_main .social_bookmarks, .responsive.html_top_nav_header #top .social_bookmarks {
right: -100px;
}}

    and adjust as needed.

    Best regards,
    Andy

    November 16, 2016 at 7:21 pm #713145
    team_ubermedia

    This new code seems to make the social icons disappear in mobile mode. I do have some other custom CSS for mobile that I’ve added. Does that possibly conflict with this new code?

    November 17, 2016 at 1:06 am #713307
    team_ubermedia

    Ideally, if I can get exactly how the social icons show up in mobile like the kriesi.at support side, we would be happy! I’ve attached an image from iphone landscape mode.

    November 18, 2016 at 1:03 pm #713960
    Andy

    Hi,

    Please post us your login credentials (in the “private data” field), so we can take a look at your backend.

    Login credentials include:

    • The URL to the login screen.
    • A valid username (with full administration capabilities).
    • As well as a password for that username.
    • permission to deactivate plugins if necessary.

    Best regards,
    Andy

    November 18, 2016 at 7:31 pm #714148
    team_ubermedia

    For now, we’ve enabled the social icons in the footer which will be our backup.

    Information in the private content area. Thank you!

    November 22, 2016 at 1:03 pm #715279
    Andy

    Hi,

    try this code:

    @media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (orientation: landscape) { 
#top #wrap_all .social_bookmarks, #top #wrap_all .social_bookmarks a, #top #wrap_all .social_bookmarks li {
display: initial;
top: -9px;
right: 8px;
float: right;
}
#advanced_menu_toggle {
right: -35px;
}}

    and adjust as needed. Hope this helps!

    Best regards,
    Andy

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.