-
AuthorPosts
-
January 3, 2020 at 1:38 pm #1169292
I can’t sort the icons at the top of the site
I have a code for desktop mode and I don’t know how to set the order of icons for mobileThe order of icons for desktop is good I don’t want to change it
This is the code I currently have
#top #wrap_all #socket .social_bookmarks {
float: none;
margin: 0;
text-align: center;
}
#top #wrap_all #socket .social_bookmarks li {
float: none;
display: inline-block;
}
#socket .social_bookmarks li a {
width: 50px!important;
line-height: 50px!important;
min-height: 50px!important;
font-size: 20px;
}
#socket .social_bookmarks li {
height: 50px!important;
width: 50px!important;
}
#socket .social_bookmarks {
height: 60px!important;
}
#socket span.copyright {
font-size: 15px !important;
text-align: center;
width: 100%;
}
.html_bottom_nav_header.html_cart_at_menu #top .av-logo-container .social_bookmarks {
left: auto;
right: 0;
}
.html_cart_at_menu.html_bottom_nav_header #menu-item-shop {
float: none;
right: 0;
}
#menu-item-shop .dropdown_widget {
right: auto !important;
top: 91px;
left: 0 !important;
}Thank you
YossiJanuary 4, 2020 at 4:52 am #1170172Hey Yossi,
Thanks for the link, I’m not sure exactly what you are looking to change on mobile though. Could you try to explain your intentions a bit further please?
Best regards,
RikardJanuary 4, 2020 at 1:03 pm #1170222hey Rikard
On the mobile the 4 icons: shop, logo, search and burger menuThank you
YossiJanuary 4, 2020 at 7:30 pm #1170328Hi Yossi Yerushalmi,
Could you please attach a mockup of what you’re trying to achieve?
Best regards,
VictoriaJanuary 4, 2020 at 9:55 pm #1170366January 5, 2020 at 6:59 pm #1170486Hi Yossi Yerushalmi ,
First of all, you need to wrap the code above in the media query so that it does not affect the mobile or tablet screens. Please put it between:
@media only screen and (min-width:1024px){ }
Best regards,
VictoriaJanuary 5, 2020 at 10:23 pm #1170575OK
I did it@media only screen and (min-width:1024px){
#top #wrap_all #socket .social_bookmarks {
float: none;
margin: 0;
text-align: center;
}
#top #wrap_all #socket .social_bookmarks li {
float: none;
display: inline-block;
}
#socket .social_bookmarks li a {
width: 50px!important;
line-height: 50px!important;
min-height: 50px!important;
font-size: 20px;
}
#socket .social_bookmarks li {
height: 50px!important;
width: 50px!important;
}
#socket .social_bookmarks {
height: 60px!important;
}
#socket span.copyright {
font-size: 15px !important;
text-align: center;
width: 100%;
}
.html_bottom_nav_header.html_cart_at_menu #top .av-logo-container .social_bookmarks {
left: auto;
right: 0;
}
.html_cart_at_menu.html_bottom_nav_header #menu-item-shop {
float: none;
right: 0;
}
#menu-item-shop .dropdown_widget {
right: auto !important;
top: 91px;
left: 0 !important;
}
}- This reply was modified 4 years, 11 months ago by Yossi Yerushalmi.
January 7, 2020 at 2:16 pm #1171053Hi,
Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:@media only screen and (max-width: 767px) { .responsive #top .logo { float: none !important; margin: auto !important; } .responsive .logo img { margin: auto; } .responsive.html_bottom_nav_header #top #menu-item-shop.cart_dropdown { left: 0 !important; } .responsive.html_bottom_nav_header.html_cart_at_menu #top #wrap_all .main_menu { right: 0px !important; float: right !important; width: 50% !important; } .rtl .avia-menu.av_menu_icon_beside { margin-right: 0 !important; padding-right: 0 !important; } .responsive.html_cart_at_menu #top .main_menu .menu>li:last-child { padding-right: 0 !important; margin-right: 0 !important; } ul#avia-menu-0.menu.av-main-nav { display: flex !important; flex-direction: row-reverse !important; } }
Then clear your browser cache and any cache plugin, and check.
Expected results:
Best regards,
MikeJanuary 17, 2020 at 12:32 pm #1175337Hi Mike
I’m really sorry
I didn’t see that you sent me a comment
It works great!Thank you
YossiJanuary 17, 2020 at 1:17 pm #1175369Hi,
Glad we were able to help, we will close this now. Thank you for using Enfold.For your information, you can take a look at Enfold documentation here
For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)Best regards,
Mike -
AuthorPosts
- The topic ‘Shop, logo, search and burger menu, the order of icons on mobile’ is closed to new replies.