Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Dalibor Bulic
8,728 Points@import vs link
I use @import inside html to bring in my reset CSS and a couple other styles. Should I change that from @import to <link>, and what is better to use and why?
2 Answers
Kevin Korte
28,149 PointsTo build off of Tony, @import should not be used, but in rare or special occasions.
The problem with @import is it affects page speed, because it blocks the loading of other css assets. Let's say you had your reset css in one link href, and you had your style css in a second link href. You'll still get the same order, and same cascading features, but the browsers will be able to download both stylesheets concurrently.
With @import, style sheet number two does not even start to download, until the entire style sheet on downloads.
What's even better, as Tony mentioned is reducing http request, thus having your stylesheets compiled into one larger stylesheet, which reduces the number of requests, and also helping to increase page speed.
Tony Djukic
3,468 PointsDalibor, as far as I know, there isn't a definitive 'best' as it all depends on what you're trying accomplish. I <link> files so that I can control the order the CSS is loaded in, whereas with @import it should be before any other styles. The ultimate objective should be to limit the number of server calls as much as possible, have you considered putting the CSS Reset, in minified form, into your main styles.css?