Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

General Discussion

Posted by Fatinah Hayat
Fatinah Hayat
591 Points

Workspaces not working

When I preview any code that I put into workspaces it shows as text code on a browser. I was previously working on building a site on workspaces which worked fine but all of sudden stopped working. I setup a new workspace to try again but am having the same issue. Please can you help?

<DOCTYPE html!> <html> <head> <meta charset="utf-8"> <title>Fatinah Hayat | Stylist</title> <link rel="stylesheet" href="css/normalize.css"> <link href='http://fonts.googleapis.com/css?family=Marvel:400,700italic|Open+Sans:700italic,400,700,800' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/responsive.css"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> </head> <body> <header> <a href="index.html" id="logo"> <h1>Fatinah Hayat</h1> <h2>Stylist</h2> </a> <nav> <ul> <li><a href="index.html" class="selected">Portfolio</a></li> <li><a href="contact.html">Contact</a></li> <li><a href="about.html">About</a></li> </ul> </nav> </header> <div id="wrapper"> <section> <ul id="gallery"> <li> <a href="My Img/mens.jpg"> <img src="My Img/mens.jpg" alt=""> <p>Streets of London</p> </a> </li> <li> <a href="My Img/mens2.jpg"> <img src="My Img/mens2.jpg" alt=""> <p>Formal/Casual</p> </a> </li> <li> <a href="My Img/mens3.jpg"> <img src="My Img/mens3.jpg" alt=""> <p>Oxford</p> </a> </li>

2 Answers

Saira Bottemuller
PLUS
Saira Bottemuller
Courses Plus Student 1,749 Points
Saira Bottemuller
Saira Bottemuller
Courses Plus Student 1,749 Points

Hi Fatinah! :) Have you made sure that the files themselves have the correct extension? I.E., your CSS file ends in .css, your JavaScript file ends in .js , and that the actual web-viewable file ends in .html , etc? Something similar happened to me in the past, and this was the cause, in my case.

Dave McFarland
STAFF
Dave McFarland
Treehouse Teacher
Dave McFarland
Dave McFarland
Treehouse Teacher

Hello Fatinah Hayat

You are missing some of the HTML for this page. You need the opening and closing html tags as well as the opening and closing head and body tags. You're also missing some closing tags at the end for the unordered list and section. There are also some HTML errors: use the HTML Validator to check your page for errors.

Here's your code in a somewhat working condition. There are still some HTML errors you should fix:

<html>
  <head>
  <meta charset="utf-8">
<title>Fatinah Hayat | Stylist</title>
<link rel="stylesheet" href="css/normalize.css">
<link href='http://fonts.googleapis.com/css?family=Marvel:400,700italic|Open+Sans:700italic,400,700,800' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/responsive.css">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
</head>
<body>
<header>
  <a href="index.html" id="logo">
    <h1>Fatinah Hayat</h1>
    <h2>Stylist</h2>
  </a>
  <nav>
    <ul>
      <li><a href="index.html" class="selected">Portfolio</a></li>
      <li><a href="contact.html">Contact</a></li>
      <li><a href="about.html">About</a></li>
    </ul>
  </nav>
</header>
  <div id="wrapper">
    <section>
      <ul id="gallery">
        <li>
          <a href="My Img/mens.jpg">
            <img src="My Img/mens.jpg" alt="">
            <p>Streets of London</p>
          </a>
        </li>
        <li>
          <a href="My Img/mens2.jpg">
            <img src="My Img/mens2.jpg" alt="">
            <p>Formal/Casual</p>
          </a>
        </li>
        <li>
          <a href="My Img/mens3.jpg">
            <img src="My Img/mens3.jpg" alt="">
            <p>Oxford</p>
          </a>
        </li>
        </ul>
      </section>
    </div>
  </body>
  </html>