Main Navigation Menu Font Size CSS

Linford
Tourist
6 0 2

Hi

Im trying to change just the font size of my main navigation menu at the top of my website. ive found the section of code i need to edit in the inspect element section but when i head over to change it in the shopify theme code editing tool i cant find the section i need to change in the theme.scss.liquid.

If anyone knows how i can change this i would appriciate it very much! Thank You

Lin

Replies 24 (24)
Hana29
Excursionist
22 0 2

Hi, I tried to edit code to change font size of navigation.

Have edited to 
.site-nav__dropdown-link {
@include bodyFontItalic;
display: block;
white-space: nowrap;
padding: 5px 15px;
font-size: em(10px);

in theme.scss.liquid, but nothings changed.

 

I would really appreciate it if you could advice me as well.

Thanks

 

My page: https://bitejapan.sg

aaron258
Tourist
7 0 2

Hi 

 

Can someone help me with the same problem. I need my header to fit on 1 line instead of 2. I need help reducing my font size. 

 

My webpage is https://filler-pharm.myshopify.com/

KetanKumar
Shopify Partner
24923 2498 9039

@aaron258 

sorry for that issue bt your store is password protect how can i check?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
aaron258
Tourist
7 0 2
aaron258
Tourist
7 0 2

I want it all to fit on 1 line instead of 2. I will also need space for 2 more categories to fit on the header

KetanKumar
Shopify Partner
24923 2498 9039

@aaron258 

we are not able to password how can i do this

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
aaron258
Tourist
7 0 2

try again i have just reopened it

Zworthkey
Shopify Partner
2567 309 641

hii, @aaron258 
Paste this code on top of the style-desktop.scss file.

media="(min-width: 1261px)"
@media screen and (min-width: 78.8125em){
.grid-margin-x>.xlarge-6 {
    width: calc(63% - 1.875rem) !important;
}
.cell.small-12.medium-6.large-7.xlarge-6 {
    margin-left: -80px !important;
}
.cell.small-12.medium-3.large-3.xlarge-3.flex-container.align-middle.align-right {
    margin-top: -89px !important;
    margin-left: 75% !important;
}
}

Thank You.

If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme ,
Hire us | Whatsapp. and we also help you to guide how to reach to your potential customers to increase brand presence, engagements and sales for your business or Want to know more. Read our Shopify Blogs.Email us: sales@zworthkey.com
aaron258
Tourist
7 0 2

thank you very much. However it needs to be smaller as it is still on 2 lines. Please can we make it a lot smaller as i still need to add 2-3 more categories

aaron258
Tourist
7 0 2