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 trialClint Rogers
869 Points(Fixed) Help with the two column lay out.
I'm having trouble with my two column lay out. I've re-watched the video and re done the code in CSS and HTML, but it will NOT show in two columns. I've pasted my CSS code below, any help would be much appreciated! https://w.trhou.se/ztd0piu3yh
Thanks, Clint
3 Answers
Jonathan Romine
9,344 Pointsyou need to close the list item for each item
<li>
<a href="img/kittens.jpg">
<img src="img/kittens.jpg" alt="">
<p>Kitten Earrings from my "Animal" line.</p>
</a>
</li>
just repeat (</li>) after every </a>
Michael Singleton
6,253 Pointsis gallery a class or an id?
Clint Rogers
869 Pointsit's an ID, however when I copied it from workspaces, it didn't show up with the # in front of gallery, my coding looks like this #gallery
Clint Rogers
869 Pointshttps://w.trhou.se/ztd0piu3yh is my snapshot link
Jonathan Romine
9,344 PointsTry this!
.gallery { margin: 0 auto; padding: 0; list-style: none; width:100%; max-width: 1080px;/max container width/ } .gallery li { display: inline-block; /or float:left;/ width: 45%; padding: 2.5%; background: white-smoke; color: #bdc3c7; border: solid 1px #eee; -webkit-box-shadow: 3px 3px 5px 6px #ccc; /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ / -moz-box-shadow: 3px 3px 5px 6px #ccc; / Firefox 3.5 - 3.6 / box-shadow: 3px 3px 5px 6px #ccc; / Opera 10.5, IE 9, Firefox } .gallery li .wrap{ margin: .9375em text-align:center; } .gallery li .wrap img{ width: 100%; hight: auto; margin-bottom: .9375em; } .gallery li .wrap h5 { font-weight:bold;
} .gallery li .wrap p{
}
Clint Rogers
869 PointsClint Rogers
869 PointsTHANK YOU SO MUCH!!!!!