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
M Huigen
2,285 PointsOkey im pretty sure i did something wrong i cant seem to get the pictures go into 2 colums
So i tried looking a bit through the forum but i cant find what i did wrong the pictures dont want to go into 2 colums and just stay big hope someone can help me out
M Huigen
2,285 Pointsow im sorry im not exactly sure how to put the code here but il just copy and paste it
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Michael Huigen | Prortfolio</title> <link rel="stylesheet" href="css/normalize.css"> <link href='https://fonts.googleapis.com/css?family=Josefin+Sans:400,600,700,700italic' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/main.css"> </head> <body> <header> <a href="index.html" id="logo"> <h1>Michael Huigen</h1> <h2>Portfolio</h2> </a> <nav> <ul> <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> </ul> </nav> </header> <div id="wrapper"> <section> <ul id="gallary"> <li> <a href="img/numbers-01.jpg"> <img src="img/numbers-01.jpg" alt=""> <p>experimentation with color and texture.</p> </a></li> <li> <a href="img/numbers-02.jpg"> <img src="img/numbers-02.jpg" alt=""> <p>trying to design a website.</p> </a> </li> <li><a href="img/numbers-06.jpg"> <img src="img/numbers-06.jpg" alt=""> <p>lets see if it works.</p> </a> </li> <li><a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>this is my best work.</p> </a> </li> <li><a href="img/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>oh its my only work.</p> </a> </li> </ul> </section> <footer> <a href="http://facebook.com/dashmaniac"> <img src="img/twitter-wrap.png" alt="Twitter logo"></a> <a href="https://facebook.com/dashmaniac"> <img src="img/facebook-wrap.png" alt"Facebook logo"></a> <p>© 2015 Michael Huigen</p> </footer> </div> </body>
</html>
/******************************************** greneral *********************************************/ body { font-family: 'open sans', sans-serif; }
wrapper {
max-width: 940px; margin: 0 auto; padding: 0 5; }
a { text-decoration: none; }
img { max-width: 100%; }
/******************************************** header *********************************************/
logo {
text-align: center; margin: 0; }
a{ color: #6ab47b; } h1 { font-family: 'josefin sans', sans-serif; margin: 15px 0; font-size: 1.75em; font-weight: normal; line-height: 0.8em; }
h2 {
font-size: 0.75em;
margin: -5px 0 0;
font-weight: normal;
}
nav {
text-align: center;
padding: 10px 0;
margin: 20px 0 0;
}
footer { font-size: 0.75em; text-align: center; clear: both; padding-top: 50px; color: #ccc; } /******************************************** page portfolio *********************************************/
#gallary { margin: 0; padding: 0; list-style: none; }
#gallery li { float: left; width: 45%; margin: 2.5%; background-color: #f5f5f5; color: #bdc3c7;
}
gallary li a p {
margin: 0; padding: 5%; font-size: 1.00em; color: #000 }
/******************************************** color *********************************************/
/site body/ body{ background-color: #fff; color: #6ab47b; }
/* green header**/ header { background: #6ab47b; border-color: #599a68; }
h1, h2{ color: #111; } /* nav background mobile*/ nav { background: #6aa17b; } nav a, nav a:visited { color: #111; } /selected nav link and hover/ nav a.selected, nav a:hover { color: #32673f; }
3 Answers
Rich Barker
7,832 PointsYour spelling of #gallery is incorrect in your css. Under "page portfolio.
M Huigen
2,285 Pointsomg cant believe i did that
also i found it was misspelled in the index.html
awkward i did that feels so dumb anyway thanks for the help it is fixed now
Rich Barker
7,832 PointsI really quite new to css and html, I only spotted it because I have made similar mistakes quite often. Lol.
Louis Otto
23,264 PointsHi Michael,
You're wrapping your images inside links, within list items, which isn't the best way to organise code for galleries. I recommend going through the following course to learn about divs and css styling:
Louis Otto
23,264 PointsLouis Otto
23,264 PointsHello,
It's good practise when asking questions to provide your code so that we can analyse it and help you out. Please attach your wrong code and we can see how to guide you best.