How can I increase spacing between menu names in Dawn?

Store Design
, , ,
1

is there a way to create a space between each menu name as I feel like they are close to each other

hasanali1_0-1679766258405.png
hasanali1_0-1679766258405.png1792×716 114 KB

website - https://the-style-luxe.myshopify.com/

password - reucho

thanks in advance!!

2

@hasanali1

Hello,

Please look at the below image. check and confirm this space is sufficient.

shreyhweb_0-1679769729883.png
shreyhweb_0-1679769729883.png2148×532 77.8 KB

if you satisfy for this space then please add the below code above in theme.liquid

online store >> edit code >> theme.liquid

nav.header__inline-menu ul.list-menu.list-menu--inline li { padding: 0 15px; }

Thankyou for reaching us. :slightly_smiling_face:

if facing any issue in this code the please let me know.

3

hi, this worked great but it seems to be not so responsive once resized , check the image below;

hasanali1_0-1679771783069.png
hasanali1_0-1679771783069.png1903×868 368 KB

thank you so much btw!

4

@hasanali1

Please add one more code at the same location in theme.liquid for responsive menu.

@media screen and (min-width: 767px) and (min-width: 1100px) { .header__heading-logo { max-width: 220px; } ul.list-menu.list-menu--inline>li>a>span{ font-size:14px; } nav.header__inline-menu ul.list-menu.list-menu--inline li { padding: 0 5px; } summary.list-menu__item { font-size: 14px; } }

shreyhweb_0-1679772437747.png
shreyhweb_0-1679772437747.png1920×1080 399 KB

5

hi, i tried this code but now the menu is small in size

6

Hello @hasanali1 ,

It’s GemPages support team and glad to support you today.

I would like to give you a recommendation to support you so kindly follow steps below:

  1. Go to Online Store > Theme > Edit code of your current theme

GemPages_0-1679805486709.png
GemPages_0-1679805486709.png1857×907 102 KB

  1. Open your theme.liquid theme file

  2. Paste the below code before

Let us know how it works for you.

Best regards,
GemPages Support Team

1 Like