Hello there,
Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.
@media only screen and (max-width:767px){
.header-wrap .container{
text-align: left;
}
.header-wrap .btn-menu{
float: right;
margin-right: 15px;
}
.header-wrap .col-md-4 {
max-width: 90%;
position: relative;
z-index: 2;
}
.header-wrap .col-md-8 {
margin-top: -50px;
}
#mainnav-mobi {
top: 70px;
}
}
Regards,
Kharis
Kharis,
It doesn´t work. Perhaps I have to change the logo size as it has the same size as in the desktop view.
I am using this code to see the logo at the left side and the menu at the right side but I think the issue is related to the logo size. Am I right?
@media only screen and (max-width: 767px){
.site-header .col-xs-12 {
width: 50%;
}
.site-header .col-xs-12:nth-of-type(1) {
text-align: left;
}
.site-header .col-xs-12:nth-of-type(2) > div {
margin-right: 15px;
}
}
Hello there,
Please share a link to your site, so I can have a closer look.
Regards,
Kharis
Hello there,
Thank you for sharing. Your header bar is too hight as the logo too big. You’d need to add this additional CSS:
@media only screen and (max-width: 1024px) {
.site-header {
max-height: 70px;
}
}
Regards,
Kharis
The logo hasn´t changed, only the red background and now there is a white gap between the header and the slider
How can I solve this? thanks
Hello there,
Try to adjust the margin top value in this lines of code
.site {
margin-top: 140px;
}
found in your custom CSS code
/*Menu sticky en celulares */
@media only screen and (max-width:1024px) {
#masthead.site-header{
position: fixed !important;
}
.site {
margin-top: 140px;
}
}
Regards,
Kharis
Kharis,
How can I vertically center my logo and hamburguer menu? (mobile view)
In my homepage I have links to different pages, when you go to the pages, there is a second menu that shows only pages. I´d like to adjust its height as it is higher than my homepage menu.
Thanks for your help!
Hello there,
Please try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.
@media only screen and (max-width: 1024px) {
.site-header {
padding-top: 5px;
padding-bottom: 5px;
}
.btn-menu {
margin-top: 13px;
}
}
Feel free to ask in a new topic if you’ve something we could help. Avoid posting multiple questions at once. Use one topic for one question.
Regards,
Kharis
Hi Kharis, it works but when I scroll down the page the menu becomes higher and the logo and the hamburger menu move down.
How can I fix this?
Thanks
Hello there,
Please share a link to your site, so I can see the actual situation in there.
Regards,
Kharis
