Hi moderators,
I’m building a website for a client and have a problem with the logo.
The setting is Logo Right, Menu Left.
In CSS i changed the position of the Logo to the center:
.html_header_top #top .av_logo_right .logo {
right: auto;
left: 50%;
margin-left: -85px;
}
It looks good now but when i change the screen to mobile or table the logo falls of the screen and the hamburger menu shows first left when you decrease the size and then appears to the right.
What i would like to have is that the logo is centered all the time. On desktop the menu needs to be as it is. On Moblie and Tablet can be Hamburger Menu postioned to the left.
I really hope you guys can help me out.
Website link and pw are in private section.
Hey KingFilly,
Please try this CSS instead:
@media only screen and (min-width: 990px) {
.html_header_top #top .av_logo_right .logo {
right: auto;
left: 50%;
margin-left: -85px;
}
}
Best regards,
Rikard
Hi Rikard,
i added the code to Quick CSS but this didnt changed anything.
See the imgur link of screenshots on mobile and tablet view.
Hope to hear from you.
hi rikard, hope you have another solution for me!
regards, filip
Hi,
Thanks for the update. Adjust the code a bit.
@media only screen and (min-width: 990px) {
.html_header_top #top .av_logo_right .logo {
right: auto;
left: 50%;
transform: translateX(-50%);
position: relative;
}
#header_main {
height: 120px;
}
.responsive #top #wrap_all .main_menu {
left: 0;
right: auto;
}
}
Best regards,
Ismael
Perfect Ismael!
Thank you very much.
You can close this thread now.