Show Social Media Icons in Top Bar on Mobile - Support | Kriesi.at

Tagged: mobile, secondary menu, social media icons, top bar

Viewing 6 posts - 1 through 6 (of 6 total)

Author

Posts
September 12, 2019 at 6:46 pm #1137632
MJM
Participant
Hello,

I have a secondary menu and social media icons added to the top bar, but the social media icons disappear on mobile. I added the following code after reading this thread:
```
@media only screen and (max-width: 990px) {
.responsive.html_mobile_menu_tablet #top #header #header_meta .social_bookmarks {
    display: block !important;
    text-align: right !important;
}
}
```
This made the social media icons visible, but pushed the secondary menu underneath. I would also like the secondary menu aligned right instead of centered. Basically, I would like it to look exactly the same on mobile as it does on the desktop. Any ideas about what code I need to add to make this happen? Thanks for your help!
- This topic was modified 4 years, 10 months ago by MJM.
September 14, 2019 at 4:54 am #1138260
Rikard
Keymaster
Hey Kirstie,

Please try this CSS as well:
```
@media only screen and (max-width: 767px) {
.responsive #header .social_bookmarks {
    width: auto;
}
}
```
Best regards,
Rikard
September 17, 2019 at 4:53 pm #1139158

MJM
Participant

Thank you! That got everything on one line. Is there a way to right align the “Make a Payment” link?

September 17, 2019 at 5:31 pm #1139171
Jordan Shannon
Inactive Moderator
Hi,

Add this to quick css:
```
@media only screen and (max-width: 767px){
li#menu-item-802{
float:right!important;
margin-top:12px!important;
}

.av_icon_active_right .social_bookmarks{
padding-left:0px!important;
}}
```
Best regards,
Jordan Shannon
September 17, 2019 at 6:07 pm #1139193

MJM
Participant

That did the trick! Thanks so much!

September 17, 2019 at 6:15 pm #1139200

Jordan Shannon
Inactive Moderator

Hi,

No problem at all. If you need additional help, please let us know here in the forums.

Best regards,
Jordan Shannon
Author

Posts