Header menu mobile version does not work properly

Hi there,

Thanks for helping me last time (with moving the menu underneath the logo). Only the moving of the menu created another problem. It only shows half the menu on the mobile version. You can’t read the letters, only the last two (see picture). COuld you please help me?

Website: www.easyandbreezy.nl

Thanks a lot!

Kind regards, Meike

Hi Meike,

I hope you are well today and thank you for your question.

You can try changing this issue by changing the below custom CSS code

.site-navigation-inner {
    float: none;
    margin: 0 auto;
    display: table !important;
    width: auto;
}

as following

@media (min-width: 767px){
.site-navigation-inner {
    float: none;
    margin: 0 auto;
    display: table !important;
    width: auto;
}
}

Which you have added in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Activello Options -> Other -> Custom CSS

Best Regards,
Movin

Hi Movin,

Thanks for your answer! I tried it, but unfortunately it doesn’t work. The menu is a bit more to the left, but it’s still showing only a couple of the last letters as in the picture…

Do you know another solution?
Hope to hear from you.

Kind regards,
Meike

It seems this is happening because of the child theme you are using on your site so to confirm it just temporary use the Sparkling theme instead of child theme on your site. If everything works fine then it’s your child theme issue so just share me your child theme so that i can troubleshoot it.

Why are you loading your child theme style.css file twice in your site as shown in the attached screenshot?

Also why have you copied and pasted the style.css file code from parent theme in to child theme style.css file?

Hi Movin,

Thanks for your answer. When I activate the normal Activello (not child theme, I guess that’s what you mean with Sparkling or do you mean to upload a whole new theme for the time being?!) the menu works fine on mobile, so indeed it must be the child theme. In the attachments you find my style.css of the child theme

And the answer the other questions: I really really don’t know why I did that or what I did, as you can see I’m a real newby :S. Maybe it’s loading twice, because I changed some things in the editor of the child theme and also in the customizer, activello options, extra css, i don’t know.

This is the style.css, sorry there was an error

Hope this works…

Yes it seems your child theme issue.

Please share me your whole child theme files and not just style.css file.

If you can’t share it then would you mind if i log in to your site and do some troubleshooting? If this is ok then could you please share me your site log in details privately by checking the option “Set as private reply” when replying to this topic?

No that’s fine! Thank you so much!

username: meike
password: Meikedepont123

I have resolved the issue by editing style.css and functions.php file on your site.

I have attached the original style.css file of your child theme so that you can use come CSS code in your style.css file by copy pasting it but please do not copy whole CSS code which contains CSS code from parent Activello theme so it becomes redundant.

Hi Movin,

Okay, thank you so much for your help! It looks great now!

Have a nice day :slight_smile:

Kind regards, Meike

You are most welcome here :slight_smile: