Change size of main menu items Dawn 15V

hiii

I would like to increase the size of main menu items just for header not footer. please check screenshot

store url - https://5a3cf5-fc.myshopify.com/

Hello! Please follow these steps to add this CSS code:

  1. Go to your Online Store
  2. Click on “Themes”
  3. Select “Edit code”
  4. Open your CSS file. If you have a custom CSS file, open that instead.
  5. If you can’t find your custom CSS file, open “component-menu-drawer.css” OR base.css" OR “theme.css”.
  6. Add the following code at the end of the file.
nav.menu-drawer__navigation ul.menu-drawer__menu.has-submenu.list-menu li > *, 
nav.menu-drawer__navigation ul.menu-drawer__menu.has-submenu.list-menu li summary {
    font-size: 24px;
}

Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.

1 Like

Hello @ctal37
Go to online store ----> themes ----> actions ----> edit code ----> assets ----> component-menu-drawer.css
add this code at the end of the file.

.list-menu__item {
font-size: 26px !important;
}

result

If this was helpful, hit the like button and accept the solution.
Thanks

1 Like

Hi @ctal37 ,

You can increase the size of header menu items just by adding a small piece of CSS code on your theme. You don’t really have to open theme code editor to do that. You can simply add this code using the theme customizer. Just click on the header on left side and scroll down until you see the custom css option.

There you just need to add the below code:

.list-menu__item{
font-size: 25px;
}

You can increase or decrease the number as per your requirements. For instance, here’s the screenshot of the custom CSS under theme customizer:

2 Likes

Hi @Rohail_Ali_12

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > base.css and paste this at the bottow of the file:
@media (max-width:767px){
.list-menu__item {
font-size: 26px !important;
}
}
1 Like