So I need some help coding my nav menu, currently the font sits as this:
However I want the font to look like the rest of my custom font:
I have tried so many different codes that I've seen through this forum and I should add I'm new at this whole coding thing, I did this all last night by copying and pasting different codes I've seen. This is all the coding I have used for my font so far:
This is only in my phone version menu, as on the desktop version there isn't a drop down menu, I am also hoping it'll change the font on the desktop menu too.
Question
MilkandHoney 0
Site URL: https://harmonica-mandolin-k5zk.squarespace.com/
Hi,
So I need some help coding my nav menu, currently the font sits as this:
However I want the font to look like the rest of my custom font:
I have tried so many different codes that I've seen through this forum and I should add I'm new at this whole coding thing, I did this all last night by copying and pasting different codes I've seen. This is all the coding I have used for my font so far:
.newsletter-block .newsletter-form-button {
font-family: 'Afrah-Light.otf' !important;
font-size: 12px !important;
font-weight: 400 !important;
letter-spacing: .12em !important;}
.collection-type-products .grid-title {
font-family: 'Afrah-Regular.otf';
}
.blog-item-title h1 {
font-family: 'Afrah-Regular.otf' !important;
}
nav#mainNavigation span {
font-family: 'Afrah-thin.otf' !important;
}
.sqs-block-button-element {
font-family: 'Afrah-Thin.otf' !important;
}
.header-title-text {
font-family: 'Afrah-Regular.otf';
}
@font-face {
font-family: 'Afrah-Regular.otf';
src: url('https://static1.squarespace.com/static/6022cb3df94c921352bb00c0/t/6022cd7cc1e1cc6421e117e3/1612893564915/Afrah-Regular.otf');
}
@font-face {
font-family: 'Afrah-Light.otf';
src: url('https://static1.squarespace.com/static/6022cb3df94c921352bb00c0/t/6022cd6f5d81ae6201c0613a/1612893551991/Afrah-Light.otf');
}
@font-face {
font-family: 'Afrah-Thin.otf';
src: url('https://static1.squarespace.com/static/6022cb3df94c921352bb00c0/t/6022cd76eb9d5f2e0a0d72e2/1612893558855/Afrah-Thin.otf');
}
h1 {font-family: 'Afrah-Regular.otf';}
h2 {font-family: 'Afrah-Light.otf';}
h3 {font-family: 'Afrah-Light.otf';}
h4 {font-family: 'Afrah-Light.otf';}
p{font-family: 'Afrah-Regular.otf';}
and this is the coding I have most recently tried:
nav.header-menu-nav-list *, .header-nav * {
font-family: 'Afrah-Light.otf' !important;
}
This is only in my phone version menu, as on the desktop version there isn't a drop down menu, I am also hoping it'll change the font on the desktop menu too.
Thanks in advance!
Link to post
Top Posters For This Question
1
1
Popular Days
Feb 10
1
Feb 14
1
Top Posters For This Question
MilkandHoney 1 post
tuanphan 1 post
Popular Days
Feb 10 2021
1 post
Feb 14 2021
1 post
Posted Images
1 answer to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment