HTML Introduction to HTML and CSS Make It Beautiful With CSS Select and Style by Class

Meagan Bowden
Meagan Bowden
859 Points

" class="card-title"> Background " shows up after I add A class to the title, instead of just "background," as the title

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>Michael Hays Profile</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="styles.css"> <link href="https://fonts.googleapis.com/css?family=Muli%7CRoboto:400,300,500,700,900" rel="stylesheet"></head> <body>

<div class="main-nav">
    <ul class="nav">
      <li class="name">Michael Hay</li>
      <li><a href="#">Toronto</a></li>
      <li><a href="resume.html">Experience</a></li>
      <li><a href="#">Photos</a></li>
      <li><a href="#">Contact</a></li>
    </ul>
</div>

<header>
  <img src=http://placeimg.com/400/400/tech alt="Drawing of Jane Smith" class="profile-image">
   class="tag name">Hello, I’m Michael.
   class="tag location">My home is Toronto, Ontario.
</header>

<main class="flex">
  <div class="card">
    <h2> class="card-title"> Background</h2>
            <ul>
                <p> <li>I’m an aspiring web designer who loves everything about the web.</li> <li> I worked in the food industry for 15 years.</li> <li> I was an executive chef.</li> <li> I want a new beginning so I throwing everything I have into team treehouse.</li> <li> I have a burning desire to be a front end web developer</li> </p> <li>fourth list item</li>
  <p> I’ve been a professional cook and gardener and am a life-long learner who's always interested in expanding my skills.</p>
                <li> fourth list item.</li>
                </ul>
            <h3> A new subsection</h3>
            </div>
 <ul>

      <li>To learn more, <a href="resume.html">view my resume.</a></li>
    </ul>


  <div class="card">
    <h2>Goals</h2>
    I want to master the process of building web sites and increase my knowledge, skills and abilities in:
    <ul class="skills">
      <li>HTML</li>
      <li>CSS</li>
      <li>JavaScript</li>
      <li>Ruby</li>
      <li>Rails</li>
    </ul>
    I’d like to work for a web design firm helping clients create an impressive online presence.
  </div> 

</main>
<footer>
  <ul>
    <li><a href="http://twitter.com/treehouse" target="_blank" class="social twitter">Twitter</a></li>
    <li><a href="#" class="social linkedin">LinkedIn</a></li>
    <li><a href="#" class="social github">Github</a></li>
  </ul>
  class="copyright">Copyright 2015, Jane Smith
</footer>

</body> </html>

1 Answer

Fernando Boza
Fernando Boza
24,509 Points

Meagan Bowden i see you're missing the quote marks in the IMG tag as well. But for the h2 class you're closing the opening tag <h2> too early and the attribute class is after not it's not getting read

<!--- remember that attributes like classes, id, etc go inside the OPENING tag.  --->
<!--- anything after is considered text for the browser to read --->
<h2 class="card-title"> Background</h2>

<!--- Wrap the link within the src attribute in qotes " " --->
<img src="http://placeimg.com/400/400/tech" alt="Drawing of Jane Smith" class="profile-image">

<!--- these are missing the opening and closing tag i,e --->
<!--- <p class="tag name">Hello, I’m Michael.</p> --->
   class="tag name">Hello, I’m Michael.
   class="tag location">My home is Toronto, Ontario.