Your portfolio should contain at least one element with a class of project-tile

I am stuck, I have a class=“project-tile” in the projects section below, however cannot get past the step:

Your portfolio should contain at least one element with a class of project-tile .

Your code so far

WARNING

The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.

<!DOCTYPE html>
<html>
  <title>Personal Portfolio Webpage</title>
  <head>
    <meta charset="UTF-8" />
    
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="./styles.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Oswald:wght@400;700&display=swap" rel="stylesheet">
  </head>
  <body>
<div class="topnav" id="navbar">
  <a href="#contact">Contact</a>
  <a href="#projects">Projects</a>
  <a href="#whatido">My Passions</a>
  <a href="#welcome-section">Home</a>
</div>
<!--Header-->
    
   
<div class="header" id="welcome-section">
  <h1 class="waviy">

   <span style="--i:1">W</span>
   <span style="--i:2">.</span>
    <span style="--i:3">G</span>
   <span style="--i:4">.</span>
   <span style="--i:5"></span>
   <span style="--i:6">S</span>
   <span style="--i:7">M</span>
   <span style="--i:8">I</span>
   <span style="--i:9">T</span>
   <span style="--i:10">H</span>
  </h1>
  <p class="headerinfo"><i>~3 out of 4 people make up 75% of the population~</i></p>
</div>
<!--HEADER-END-->
<!--ABOUT-ME-->   
<div class="row">
  <div class="column" ><img class="aboutmeimg" src="https://i.postimg.cc/Jzg8m61g/FB-IMG-1652994294401.jpg"></div>
  <div class="column">
    <div class="container">
    <p class="p">I started my adult journey in the United States Air Force as an Aerospace Propoplesion technician.  After leaving the Air Force I wondered aimlessly picking up a B.S. in Social science and taking a truck-load of design courses at a community college. Upon realizing my B.S. was a dead end I found myself in the realm of education as an instructional assistant.  I have since obtained 3 different Masters degrees, one in curriculum design a second in special education, and a third in educational leadership.  I have worked in education as a teacher for over a decade and have been part of varying leadership teams and roles.I have begun teaching myself to code by utilizing Freecodecamp as my primary resource.  Service before self, excellence in all we and integrity first are core values that I have taken from the Air Force and implemented in my life.  I can’t stop, won’t stop learning, and continue to push myself to be uncomfortable in learning new things.</p>
    </div>
  </div>
</div>
<!--ABOUTME-END-->
<!--What I do-->
<div class="whatido" id="whatido">
  <h3 class="text" >My Passions</h3>
</div>
<!--What I DO-->    
<div class="row">
  <div class="column">
    <div class="container2"><p class="p">
      DESIGN</p>
    </div>
    <br>
    <p class="designtitle">PHOTOSHOP</p>
    <span class="star">
      &#9733; &#9733; &#9733; &#9733; &#9733;</span>

    <p class="designtitle">HTML</p>
    <span class="star">
   &#9733; &#9733; &#9733; &#9734; &#9734;
    </span>
    <p class="designtitle">CSS</p>
    <span class="star">
   &#9733; &#9733; &#9733; &#9734; &#9734;
    </span>
  
  </div>
  <div class="column">
    <div class="container2"><p class="project-title">
      EDUCATION</p></div>
    <p class="designtitle"> B.S. Social Sciences: Washington State</p>
    <p class="designtitle"> M.Ed. Special Education: Arizona State </p>
    <p class="designtitle"> M.Ed. Curriculum & Instruction: Arizona State</p>
    <p class="designtitle"> M.Ed. Educational Leadership: Indiana State</p>
  </div>
  <div class="column">
  <div class="container2">
    <p class="project-tile">FAMILY</p>
      
    </div>
    Insert Picture
  </div>  
  </div>
</div>
<!--What I do ENd-->

<!--projects-->
<div class="project-tile" id="projects">
  <h4 class="text">Projects</h4>
</div>
<!--projects-->    
<div class="row">
  <div class="column" >
    <div class="container2"><p class="project-tile">Photo Editing</p>
    </div>
      
    </div>
  <div class="column" >
    <div class="container2" ><p class="project-tile">Design</p>
    </div>
      
    </div>
  <div class="column" ><div class="container2"><p class="project-tile">Art</p>
    </div>
  </div>
</div>
    <!--Contacts-->
<div class="contact" id="contact">
  <h5 class="text">Contact</h5>
</div>
<div class="bottomnav">
  <a href"#">Facebook</a>
  <a href"#" id="profile-link" target="_blank">FreeCodeCamp</a>
  <a href"#">E-mail</a>
  <a href"#">Phone</a>
  
  
</div>

<div class="footer">
  <p>Footer</p>
</div>

</body>
</html>

Your browser information:

User Agent is: Mozilla/5.0 (X11; CrOS x86_64 14388.61.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.107 Safari/537.36

Challenge: Build a Personal Portfolio Webpage

Link to the challenge:

Hi @dwgsmith !

There are these User Stories:

  1. Your portfolio should have a projects section with an id of projects
  2. The projects section should contain at least one element with a class of project-tile to hold a project

The projects section (the element with id="projects") should contain the elements with class="project-tile".

But it looks like your elements with class="project-tile" are outside of your projects section. Also, I think you don’t need to add the class="project-tile" to the projects section itself. Take a look at this part of your code:

<!--projects-->
<div class="project-tile" id="projects"><!-- You can remove the class from this element -->
  <h4 class="text">Projects</h4>
</div>
<!--projects--><!-- Try nesting the elements below into the projects section above -->
<div class="row">
  <div class="column" >
    <div class="container2"><p class="project-tile">Photo Editing</p>
    </div>
      
    </div>
  <div class="column" >
    <div class="container2" ><p class="project-tile">Design</p>
    </div>
      
    </div>
  <div class="column" ><div class="container2"><p class="project-tile">Art</p>
    </div>
  </div>
</div>

Hope that helps :slightly_smiling_face:

Excellent, thanks help a ton, really appreciative of this community!

1 Like