The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

@import not working

3 posters

Go down

Solved @import not working

Post by Valoish July 3rd 2017, 9:29 pm

Technical Details


Forum version : #phpBB2
Position : Founder
Concerned browser(s) : Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari
Who the problem concerns : All members
Forum link : http://www.canvasforums.com

Description of problem

I have the following import rule pasted at the top of my CSS Stylesheet but for some reason it isn't working..
Code:
@import url('https://fonts.googleapis.com/css?family=Hind|Noto+Sans|PT+Sans|Raleway|Quicksand');
Whenever I try to use one of those font families in my CSS it doesn't show on the forum


Last edited by Valoish on July 5th 2017, 5:14 pm; edited 1 time in total
Valoish
Valoish
Forumember

Female Posts : 291
Reputation : 54
Language : English
Location : NYC

http://www.canvastutorials.org/

Back to top Go down

Solved Re: @import not working

Post by Ange Tuteur July 3rd 2017, 11:09 pm

Hi @Valoish,

If memory serves right, @import rules don't work in the stylesheet unless you deactive the basic CSS. (Display > CSS > Deactivate the Basic CSS) The reason they don't work is because Forumotion merges the forum's basic CSS and your custom CSS, with the basic CSS coming BEFORE your custom CSS, so it renders the @import rules useless, because @import rules have to be at the very beginning of the stylesheet. (see "@import" for extra info)

It should work if you disable the basic CSS, but that can pose a problem if you're using basic styles.. I think the best alternative would be to edit the overall_header template and include the following tag in the <head> section.
Code:
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Hind|Noto+Sans|PT+Sans|Raleway|Quicksand"/>
Basically you place the import URL as the href value.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: @import not working

Post by Valoish July 5th 2017, 4:35 pm

Ooh boo ; A; Okay I guess I'll have to use the HTML tag instead XD
Thankies~
Valoish
Valoish
Forumember

Female Posts : 291
Reputation : 54
Language : English
Location : NYC

http://www.canvastutorials.org/

Back to top Go down

Solved Re: @import not working

Post by Draxion July 5th 2017, 5:06 pm

May I mark this solved, @Valoish?
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

Solved Re: @import not working

Post by Valoish July 5th 2017, 5:14 pm

I did before whattheheck
Marked it again LOL
Valoish
Valoish
Forumember

Female Posts : 291
Reputation : 54
Language : English
Location : NYC

http://www.canvastutorials.org/

Back to top Go down

Solved Re: @import not working

Post by Draxion July 5th 2017, 5:18 pm

Thank you. Smile
Problem solved & topic archived.
Please read our forum rules: ESF General Rules
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum