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

HTML

Posted by Samuel Heywood-Everett
Samuel Heywood-Everett
122 Points

Help linking css stylesheet to HTML

Hey guys, quite new to this and hope you can help. My stylesheet doesnt seem to work when I open in browser. Ill attach the snipets i suspect as a culprit, but after looking at some problems other people have had i cant seem to fix it. Hope you can help and thanks!

'''<!DOCTYPE HTML> <html> <head> <title> BumbleBee </title> <style> <link rel="stylesheet" type= "text/css" href="stylesheet.css" /> </style> <a href="https://en.wikipedia.org/wiki/Bumblebee"> <img src="bumblebee.jpg" alt="Bee" width="200" height="200" align="middle"> </a> </head>'''

style sheet ''body{background-color:black; } h1{font-family: Verdana; text-align:center; color: yellow } ul{ color: yellow; font-size: 25px; }'''

2 Answers

Steven Parker
Steven Parker
231,072 Points
Steven Parker
Steven Parker
231,072 Points

There's a few issues with the organization of the HTML:

  • there should be no HTML code betwee "style" tags (only CSS)
  • you don't need a "style" tag when using an external CSS file
  • there should not be any page content inside the "head"
  • all page content goes in the "body"

So, reoganizing it would give you something like this:

<!DOCTYPE html>
<html>
  <head>
    <title>BumbleBee</title>
    <link rel="stylesheet" type="text/css" href="stylesheet.css">
  </head>
  <body>
    <a href="https://en.wikipedia.org/wiki/Bumblebee"> 
      <img src="bumblebee.jpg" alt="Bee" width="200" height="200" align="middle">
    </a>
  </body>
</html>
Rachel Lev
Rachel Lev
14,583 Points
Rachel Lev
Rachel Lev
14,583 Points

I think type="text/css" Is not required with the HTML5 , only for older versions of HTML. Is this correct?

Steven Parker
Steven Parker
231,072 Points
Steven Parker
Steven Parker
231,072 Points

The MDN page for <link> shows "type" as a currently valid attribute, and that is supported in all browsers, but the examples given don't use it. It has apparently been optional since HTML4.

Rachel Lev
Rachel Lev
14,583 Points
Rachel Lev
Rachel Lev
14,583 Points

HTML <!DOCTYPE> Declaration: <!DOCTYPE html>

to link css: <link rel="stylesheet" href="styles.css"> remove the <style> tags.