iam not able to solve a simple code plz any boy try to help

Question

just look at it ...........

about.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Nick Pettit | Designer</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/main.css">
  </head>
  <body>
    <header>
      <a href="index.html" id="logo">
        <h1>Nick Pettit</h1>
        <h2>Designer</h2>
      </a>
      <nav>
        <ul>
          <li><a href="index.html">Portfolio</a></li>
          <li><a href="about.html" class="selected">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </header>
    <div id="wrapper">
      <section>
        <a><img src="img/gratt.png" alt="my photo"class="profile-photo"></a>
        <p3>this a photo of writer inc </p3>
      </section>
      <footer>
        <a href="http://twitter.com/nickrp"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a>
        <a href="http://facebook.com/nickpettit"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a>
        <a ><img src="img/gratt.png" alt="my photo"class="profile-photo"></a>

      </footer>
    </div>
  </body>
</html>

css/main.css

a {
  text-decoration: none;
}

#wrapper {
  max-width: 940px;
  margin: 0 auto;
}

#logo {
  text-align: center;
  margin: 0;
}

h1, h2 {
  color: #fff;
}

nav a {
  color: #fff;
}

nav a:hover {
  color: #32673f;
}

h1 {
  font-family: ‘Changa One’, sans-serif;
  font-size: 1.75em;
  font-weight: normal;
}

img {
  max-width: 100%;
}

#gallery {
  margin: 0;
  padding: 0;
  list-style: none;
}

#gallery li {
  float: left;
  width: 45%;
  margin: 2.5%;
  background-color: #f5f5f5;
  color: #bdc3c7;
}

nav ul {
  list-style: none;
  margin: 0 10px;
  padding: 0;
}

nav li {
  display: inline-block;
}

nav a {
  font-weight: 800;
  padding: 15px 10px;
}

Answer 1 · 2017-06-19T22:08:18Z

June 19, 2017 10:08pm

Hello Saisin!

There seems to be a number of problems with your code. No worries, though! We've all been there.

Problem #1:

I myself am not sure if this is messing up the website, but in

Your class attribute is too close to the alt attribute. Try putting a space before the class attribute.

Problem #2

<p3>this a photo of writer inc </p3>

This is a more important bug to fix, since "p3" is not an html5 element. Try using the <p></p> element instead. If you really want to use "p3", change it into a class by doing

and change the selector of any CSS rule you want to style the p3 with to

.p3 {}

Problem #3

This problem is probably a mistake, and will be easy to solve. In the beginning tag of the anchor element(<a>), you forgot to add a "href" attribute. You can either remove the link completely by deleting the <a> and </a>, or put in the href to any link you want.

If you have any more questions, please reply.

Best Regards,

Ashton

P.S. It is hard to tell what you are trying to ask for help with, so next time be more specific and don't rely on the copy paste to show your method. :-)

Welcome to the Treehouse Community

Looking to learn something new?

saisindhoorreddy palla

saisindhoorreddy palla

iam not able to solve a simple code plz any boy try to help

1 Answer

Ashton Roman

Ashton Roman