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

Not working

https://gyazo.com/164355f9be877b5afe5b831b729670cb https://gyazo.com/73b043ecc570f1158f570f1181ea3d8d

here is my code, had to make some differences, had some trouble with colors.

All of my pictures are 512x512

CSS:

/************ GENERAL *************/

body { font-family: 'font-family: 'Nunito', sans-serif;' }

wrapper {

max-width: 940px; margin:0 auto; padding: 0 5%; }

a {text-decoration: none;} }

img { max-width: 100%; }

/************ HEADING *************/

logo {

text-align: center; margin: 0; }

/* Logo color */ h1, h2 { color: #696969; }

/* Logo font and size */ h1{ text-align:center; font-family: 'Lobster', cursive; margin: 15px 0; font-size: 2.75em; font-weight: bold line-height: o.8em; }

h2{ text-align:center; font-family: 'Lobster', cursive; margin: -5px 0 0; font-size: 2.25em; font-weight: normal; line-height: o.8em; }

/************ NAVIGATION *************/

nav { text-align: center; padding: 10px 0; margin: 20px 0 0; }

/************ FOOTER *************/

footer { foot-size: 2em; text-align: center; padding-top: 50px; color: #ccc }

/************ PAGE: FRAMSIDE *************/

gallery {

margin: 0; padding: 0; list-style: none; }

gallery li {

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

/************ COLORS *************/

/* site body */ body { background-color: #00F5FF; color: #fff; }

/* Blue header*/ header { background: #63B8FF; border-color: #6495ED; } /* nav background on mobile / nav { background: #6495ED; } } / logo text */ h1, h2 { color: #696969; }

/* links */ a { color: #6495ED; }

/* nav link*/ nav a, nav a:visited { color: #fff; }

/* selected nav link */ nav a.selected, nav a:hover { color: #C1CDCD; }

HTML:

<!DOCTYPE html>

<html>

<head> <meta charset="utf-8"> <title>Åsmund Waage | Kul fyr</title> <link rel="stylesheet" href="css/normalize.css"> <link href='https://fonts.googleapis.com/css?family=Lobster|Nunito' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/main.css"> </head>

<body>

<header>
  <a href="index.html" id="logo">
    <h1>&Aring;smund Skjeldal Waage</h1>
    <h2>Kul fyr, alt i alt</h2>
  </a>
  <nav>
    <ul>
      <li><a href="index.html" class="selected">Forside</a></li>
      <li><a href="Informasjon.html">Om Meg</a></li>
      <li><a href="Kontakt.html">Kontakt</a></li>
    </ul>
  </nav>
</header>
<div id="wrapper">

<section> <ul id="gallery"> <li> <a href="img/Kappa.png"> <img src="img/Kappa.png" alt=""> <p>Kappa</p> </a> </li> <li> <a href="img/Doge.png"> <img src="img/Doge.png" alt=""> <p>Doge</p> </a> </li> <li> <a href="img/Pepe.png"> <img src="img/Pepe.png" alt=""> <p>Pepe</p> </a> </li> <li> <a href="img/TrollFace.png"> <img src="img/TrollFace.png" alt=""> <p>Troll Face</p> </a> </li> <li> <a href="img/Illuminati.jpg"> <img src="img/Illuminati.jpg" alt=""> <p>Illuminati Confirmed</p> </a> </li>

 </ul>

</section>

<footer> <a href="http://twitter.com/TestierHarpy"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a> <a href="http://facebook.com/aasmundwaage"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a>

<p>© 2016 Åsmund Skjeldal Waage.</p> </footer> </div> </body>

</html>

Steven Parker
Steven Parker
230,995 Points

Please fix your blockquotes according to the Markdown Cheatsheet info popup below :arrow_heading_down: Remember to skip a blank line before the quoted code.

Even better, make a snapshot of your workspace and post the link to it here.