HTML Introduction to HTML and CSS Adding a New Web Page Write the CSS

Yifan Yang
Yifan Yang
2,980 Points

I have the same issues as many of the students of the video. My CSS file doesn't work.

Here is my html: <!DOCTYPE html> <html> <head> <title>Henry's Resume</title> <link rel="stylesheet" href="css/resume.css"> </head> <body> <img src="http://placeimg.com/200/200/people" alt="Henry Yang, Web Developer" class="main-image"> <h1>Henry Yang, Web Developer</h1> <h2>Summary of Qualifications</h2> <ul> <li>Experience as a freelance web developer</li> <li>Experience with HTML, CSS, and JavaScript</li> <li>Master of Information Technology</li> </ul> </body> </html>

Here is my CSS: body { font-family: "Arial"; }

.main-image { border: solid 4px black; border-radius: 50%; }

Caleb Newell
Caleb Newell
4,611 Points

Friendly tip! If you could use the format on teamtreehouse, I could help you better. Thanks! p.s. (this is how you wrap code)

Wrap your code with 3 backticks (```) on the line before and after. If you specify the language after the first set of backticks, that'll help us with syntax highlighting.

      ```html
      <p>This is code!</p>
      ```

3 Answers

Armin Kadic
Armin Kadic
12,651 Points

I don't know if this might be the cause, but you wrote

<link rel="stylesheet" href="css/resume.css">

while in the video it's

<link rel="stylesheet" href="resume.css">

It depends on the location of your css file, try without "css/" in front of "resume.css".

Gabriel Kierkegaard
Gabriel Kierkegaard
1,259 Points

I'm having the excat same problem, where it worked fine in previous videos. I've also tried to rename the lass in the html and css file to no success.

''' <!DOCTYPE html> <html> <head> <title>Gab's Resume</title> <link rel="stylesheet" href="resume.css" class="main-img"> </head> <body> <img src="https://placeimg.com/200/200/tech" alt="Gab Web Developer"> <h1>Gab Web Developer</h1> <h2>Summary of Qualifications</h2> <ul> <li>Experience as a freelance web developer</li> <li>Experience with HTML, CSS and Javascript</li> <li>Bachelor of Science, Economics</li> </ul>

</body>

</html> '''

''' body { font-family: "Arial"; }

.main-img { border: solid 4px black; border-radius: 4px; } '''

Gabriel Kierkegaard
Gabriel Kierkegaard
1,259 Points
<!DOCTYPE html>
<html>
    <head>
        <title>Gab's Resume</title>
        <link rel="stylesheet" href="resume.css" class="main-img">
    </head>
    <body>
        <img src="https://placeimg.com/200/200/tech" alt="Gab Web Developer">
        <h1>Gab Web Developer</h1>
        <h2>Summary of Qualifications</h2>
        <ul>
            <li>Experience as a freelance web developer</li>
            <li>Experience with HTML, CSS and Javascript</li>
            <li>Bachelor of Science, Economics</li>
        </ul>

    </body>
</html>
body {
    font-family: "Arial";
}

.main-img {
    border: solid 4px black;
    border-radius: 4px;
}
Armin Kadic
Armin Kadic
12,651 Points

You've added class="main-img" inside the stylesheet <link> in the <head> part while it should be inside the <img> tag in the <body> part.

Gabriel Kierkegaard
Gabriel Kierkegaard
1,259 Points

Ah! Yeah I see that now. Must have been to tirede :P Thanks for pointing it out!