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

CSS CSS Basics (2014) Getting Started with CSS Importing Style Sheets with @import

Posted by Rausha Willis
.a{fill-rule:evenodd;}techdegree
Rausha Willis
Front End Web Development Techdegree Student 724 Points

Im having a hard time with the import element to link to the css file. its appearing at the top of the page

its not allowing me to put style tags in my html

Joseph Sworyk
Joseph Sworyk
7,879 Points
Joseph Sworyk
Joseph Sworyk
7,879 Points

Are you putting the link tag within the "head" tags and not the "body" tags?

Should look like this:

<html> <head> <link rel = "stylesheet" type = "text/css" href = "somedirectory/somefolder/someCSSfile.css"> </head> <body> <!-- Some body content --> </body> </html>

Iagor Moraes
Iagor Moraes
18,678 Points

you need to reference the CSS to the HTML file for make it working, follow the example:

in HTML file put: <link rel="stylesheet" href="style.css" />

1 Answer

Jon Myzzle
Jon Myzzle
6,279 Points
Jon Myzzle
Jon Myzzle
6,279 Points

Hello Rausha,

It sounds like you may be putting your stylesheet inside of the <body> tags instead of inside the <head> tags. Please see below to accomplish what you are looking for:

<!doctype html>
<html>
  <head>
   <link rel="styleSheet" href="example.css" type="text/css" />
  </head>

  <body> 
    ======Your addition content here=====
  </body>
</html>

Remember, anything that you include inside of the <body> tags will be displayed by the browser. Between the <head> tags are where you want to link external stylesheets, fonts, SOME scripts, and meta data.

I hope this helps!

Cheers, and Happy Coding! :beers:

-Jon