Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML How to Make a Website Styling Web Pages and Navigation Style the Portfolio

Posted by Richard Ni
Richard Ni
Courses Plus Student 9,130 Points

Images are not split into different columns

And there are still bullet points beside the images.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Richard Ni | Designer</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link href='https://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400,400italic,700,700italic,800' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/main.css">
  </head>
  <body>
    <header>
      <a href="index.html" id="logo">
        <h1>Richard Ni</h1>
        <h2>Designer</h2>
      </a>
      <nav>
        <ol>
          <li><a href="index.html" class="selected">Portfolio</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ol>
      </nav>
    </header>
    <div id="wrapper">
      <section>
        <ul id:"gallery">
          <li>
            <a href="img/numbers-01.jpg">
              <img src="img/numbers-01.jpg" alt="">
              <p>Experimentation with colour and texture.</p>
            </a>
          </li>
          <li>
            <a href="img/numbers-02.jpg">
              <img src="img/numbers-02.jpg" alt="">
              <p>Playing with blending modes in photoshop.</p>
            </a>
          </li>
          <li>
            <a href="img/numbers-06.jpg">
              <img src="img/numbers-06.jpg" alt="">
              <p>Trying to create an 80's style of glows.</p>
            </a>
          </li>
          <li>
            <a href="img/numbers-09.jpg">
              <img src="img/numbers-09.jpg" alt="">
              <p>Drips created using photoshop brushes.</p>
            </a>
          </li>
          <li>
            <a href="img/numbers-12.jpg">
              <img src="img/numbers-12.jpg" alt="">
              <p>Creating shapes using repetition.</p>
            </a>
          </li>


        </ul>
      </section>
      <footer>
        <a href="https://mobile.twitter.com/richarrrrddddd"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a>
        <a href="https://www.facebook.com/richard.ni.9"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a>
        <p>&copy; 2016 Richard Ni.</p>
      </footer>
    </div>
  </body>

</html> 

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

#gallery li {
  float: left;
  width: 45%;
  margin: 2.5%;
  background-color: #f5f5f5;
  color: #bdc3c7;
}
David Dong
David Dong
5,593 Points
David Dong
David Dong
5,593 Points

Can you please take the following steps to ask this question?

  1. Type six backticks like this: ``````
  2. Type HTML after the third backtick like this: HTML

  3. Press 'Enter' or 'Return' two times after HTML like this: ```HTML

                                                                                           ```

  4. Copy your HTML code within the top three backticks+HTML (HTML) and the three backticks at the bottom ()

  5. Repeat 1-4 but with CSS

2 Answers

katerogers
katerogers
6,479 Points
katerogers
katerogers
6,479 Points 
<section>
        <ul id:"gallery">

Use an equals sign instead of a colon after id

<section>
        <ul id="gallery">
Richard Ni
PLUS
Richard Ni
Courses Plus Student 9,130 Points
Richard Ni
Richard Ni
Courses Plus Student 9,130 Points

Yeah I did fix that and it's still not working. Any chance it could just be my computer?