Viewing 5 reply threads
You must be logged in to reply to this topic.
How do I get the site logo on mobile fit the width of the viewport on mobile? Happy to have the burger menu sit above or below the logo to accommodate…
Hello,
Add this css into your custom css box in Appearance > Customize > Custom Codes menu.:
@media (max-width: 480px){
#logo img {
height: 300px !important;
}
}
Change value to your wish.
Best regards!
This works to make the logo larger, but all it does is push the burger menu and social icons off the side of the screen.
I’d just want the logo full size to fit the width of the screen, then the burger menu and social icons underneath.
Hello,
Please know that this is a personal customizatin and it’s not included in support. However, i can give you a hint for the custom css, but i need to see a link of the site first.
Best regards!
sure, it is https://lieannebuckley.maverikmedia.com
Thanks!
Hello,
Please add this css:
@media (max-width: 480px){
.header_container .header-row-inner {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
}
.header_container.header-left.menu_style-simple.menu-full-style.menu-with_shadow.cl-header-light.cl-responsive-header {
height: 170px !important;
}
.main.header-row .c-left {
order: 1;
width: 100% !important;
margin-right: 90px !important;
}
.main.header-row .c-middle {
order: 2;
width: 20% !important;
}
.main.header-row .c-right {
order: 3;
width: 20% !important;
margin-right: 100px !important;
}
}
Espected result: https://ibb.co/7g30Sfc
Best regards!
You must be logged in to reply to this topic.