-
Posts
-
I am having difficulty in changing the font-family on a page.
I have given the page a CSS class but I am unable to get the font-family to be recognized with custom css. I am targeting the element but it is just changing to a generic serif or sans serif instead of the font family I am trying to get.Example
On a page I want to change the h3 tag to be the Poiret One font
I have given a page a CSS class of ‘change-font’
In the Quick CSS I have added the following
.change-font h3 {
line-height: 2em!important;
font-family: ‘Poiret One’, Sans-Serif!important;
}
The line-height is is targeting ok but the font-family is being ignored.
Your help is most welcome.Hey themeforesttony,
How did you import the font and did you make sure that the search path of it is correct?
Best regards,
RikardHi Rikard,
Nice to speak with you again.
This was not an imported font. It is one of the theme supported fonts.
I can call it from the advanced styling just fine, but when I try to call it from Quick CSS to overide, I can’t seem to get it to work.
Hope that answers.
TonyAs you can see in my first post, I did use the !important. For a font that is in the Enfold family like Poiret One, Moligo or Merriweather (just to name a couple), am I correctly calling the font-family with the following:
h3 {
lfont-family: ‘Poiret One’, Sans-Serif!important;
}Hi,
If you check your code, you
ll see that the "lfont-family:" isnt correct because the correct is: “font-family:” without the l.Best regards,
John TorvikI am sorry John. That was a typo on my part. It should have read:
h3 {
font-family: ‘Poiret One’, Sans-Serif!important;
}
Would this be the correct way to try and call the Poiret One font to be what the h3 tag displays?Hi themeforesttony,
Looks ok. Have you tired it? Could you please give us a link to your website, we need more context to be able to help you.
Best regards,
VictoriaHi,
The link to the page being developed is below.
Specifically look at the h2 tag in each portfoilio item which is a website client name (ie: FIreGlass Studio, Sensor-Kinesis).
I have given the text box element a custom css class of “center-content”
In Quick CSS I have added the following:
@media screen and (min-width: 768px){
.center-content {
margin-top: 50%!important;
}
}
<This seems to work fine for the container sizing issue>
.center-content h2 {
line-height: 2em!important;
font-family: ‘Dancing Script’, sans-serif!important;
}
<The line height call is working but the font-family is not.>Thanks
- You must be logged in to reply to this topic.