Hi, how do I fit my logo on mobile mode? It only works when the header becomes sticky menu.
I’m using Header Style 10.
Normal mode, and sticky mode:
Tried this code but didn’t work:
@media (max-width: 767px){
.td-retina-data {
width:140px;
height:48px;
}
.td-main-menu-logo img {
max-width: 140px;
max-height:48px;
}
}
Hello,
In order to have the mobile logo inside of the menu bar you will have to use another header style that has this option. The header style you use displays the logo on the top of the menu. Different header styles use different types of desktop and mobile settings.
Thank you!
Ok, and what should i do to use the mobile menu on ipad screen (portrait mode)? Because it breaks a line with other style menu options (using style 5 now).
Hello,
This is a normal behavior of the theme when you have more menu items that can fit inside a line.
Unfortunately you will have a lot to edit in order to get the mobile version of the website to the ipad portrait mode. There is no easy way to do this except edit the style.css and change all of the options from 767px to 1018px. Alternatively you could decrease the padding of the text using custom css:
@media (max-width: 1018px) and (min-width: 768px){
.sf-menu > li > a {
padding: 0 0px;
}
.sf-menu a.sf-with-ul{
padding-right: 16px;
}
}
But if you add one more menu item it will fall to another line again.
Thank you!
