How can I change products categories navigation style on mobile only? Brine template Version 7

Site URL: https://rid-studio.com/shop

hello,

1. I would like to change categories navigation style from drop-down menu to a line of categories on mobile (on web looks fine) // Brine template Version 7

2. How can I change categories navigation order?

Q1. Add to Home > Design > Custom CSS

@media screen and (max-width:640px) {
ul.category-nav-links {
    display: flex;
    justify-content: space-between;
}
#categoryNav ul li {
    display: block;
}
}

Q2. Which order you want?

Hello, Tuanphan,

i have exactly the same problem but the code doesn't work on my website (www.avrilkids.be).

I m using an old brine template too...

Please help me

Best regards

19 hours ago, priscamichaux said:

Hello, Tuanphan,

i have exactly the same problem but the code doesn't work on my website (www.avrilkids.be).

I m using an old brine template too...

Please help me

 

Best regards

The url doesn't exist. Can you check it again?

Hello Tuanphan,

thank you for your time!

Yes sorry i made a mistake in the URL it is www.avrilkids.com

but i have manage to solve the problem in an other way,

i have delete the category menu, and uses the categories as links in the main menu, it's better for me like that,

the only problem now is that the menu is separated in the mobile version, we have to click on an arrow to see the categories. Do you know how i can solve that? I would like the whole menu to appear together.

Thanks for your precious help!!!

13 hours ago, priscamichaux said:

Hello Tuanphan,

thank you for your time!

Yes sorry i made a mistake in the URL it is www.avrilkids.com

but i have manage to solve the problem in an other way,

i have delete the category menu, and uses the categories as links in the main menu, it's better for me like that,

the only problem now is that the menu is separated in the mobile version, we have to click on an arrow to see the categories. Do you know how i can solve that? I would like the whole menu to appear together.

Thanks for your precious help!!!

Where is it? I don't see it on shop page

https://avrilkids.com/shop?category=doudous

Hello Tuanphan,

the shop categories are in the main menu now (first navigation) in the shop "file", you have "Doudous", "New doudous", "Sales" & "Archives". 

It looks good on the desktop menu view but not on the mobile menu because you have to click on an arrow to see the categories. I put a printscreen of what i try to achieve in attachement.

Thanks again for your help

Best regards,

Prisca