drop down arrows on mobile menu

I did it like this in the additional css section.

@media (max-width:767px) {
.navbarprimary .dropdowntoggle {
padding:0 2px;
outline:none;
font-size:30px;
background-color:transparent;
top:-3px;
}}

Thank you @media . I get a red error on that code. Did you have to add the navbarprimary code to another style sheet or anything? or should i just be able to paste that code in and it should start working?

looks like this..
https://ibb.co/cLfbM76

Hi @kayotics

Can you please share link of web page so we can check and help.

Thanks

Hi it’s https://www.childrenofthemicrowave.com/ again its only an issue on mobile.

Any help would be greatly appreciated.

Thanks

John

• This reply was modified 5 years, 6 months ago by kayotics.

Hi @kayotics

You can increase font size and padding to make it larger. please use below custom CSS:

.navbarprimary .dropdowntoggle {
	padding: 6px 8px;
}

.dropdowntoggle .fa.caretmobile.fa-chevron-circle-down,
.dropdowntoggle .fa.caretmobile.fa-chevron-circle-right {
	font-size: 22px;
}

you can increase / decrease padding and font size accordingly and to add custom CSS: Appearance > Customize > Additional CSS.

Thanks

@kayotics – that @media in the code is necessary. Copy the whole code block and try it. It looks like you are missing the @media part.

You can see it implemented here:
Oddity-machine.com