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 Responsive Web Design and Testing Adding Breakpoints for Devices

Justin Riestra
Justin Riestra
4,904 Points
Posted by Justin Riestra
Justin Riestra
4,904 Points

Help Formatting Image Grid

Having trouble figuring out how to format my image list into a four image grid that remains a grid when flexing the browser. I've included the code, any help is appreciated!

/*************** Site **************/

wrapper {

max-width: 1000px; margin: 0 auto; background-color: #000000; }

body { width: 100%; margin: 0 auto; overflow: auto; }

img { max-width: 100%; }

/*************** Links **************/ a { text-decoration: none; }

/*************** Header position **************/ header { margin: -15px auto; }

header h1 { padding-bottom: 1px; margin-bottom: 3px; }

header h5 { padding: 1px 3px; margin: 0; border-bottom: solid black 1px; }

/*************** Header Styling **************/ .header { text-align: center; color: #000000; background-color: #fff; }

.header h1 { line-height: 25px; letter-spacing: 10px; }

.header h5 { font-size: .75em }

navlist li {

display: inline-block; padding: 0 10px; }

/*************** Section position **************/ section { width: auto; padding-top: 1px; color: #fff; }

/*************** Section--image position/styling **************/

.story-photo { width: 50%; height: 25%; }

image-list li {

list-style: none; display: inline-block; padding: 0; margin: 0 auto; }

image-list p {

margin: 0; }

image-list img {

padding-bottom: 0; }

/*************** Footer position **************/

/*************** Footer text and color **************/

Kathryn Notson
Kathryn Notson
25,941 Points

Justin Riestra:

Follow the instructions below for "Markdown Cheatsheet to post your code correctly.

Just from what you typed here, it appears you didn't use the "#" id selector or the "." class selector in some of your CSS code. Not sure if that's the issue, but without seeing all your code, it's difficult to tell what your problem is.