Mobile Menu .caret Icon

I am finding that the .caret icon size is making it challenging to find the dropdown menu on the mobile menu.

Is there a way to make the size larger for the mobile menu? Or any other suggestions for making the dropdown easier for users when they are using mobile devices?



Hey there,

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

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Additional CSS

/*increase caret size*/
@media (max-width: 768px){
 .caret {
    border-top: 11px dashed;
    border-top: 4px solid\9;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;

Best regards,


I ended up editing the CSS to the following:

/increase caret size/ @media (max-width: 768px){

.caret {
border-top: 7px dashed;
border-right: 6px solid transparent;
border-left: 6px solid transparent;
} }

Hi, there

Nice to hear your problem is fixed:)
Now I will now close the topic and mark it as resolved. Feel free to contact us again Thanks!