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

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

Tarek El Hinaoui
PLUS
Tarek El Hinaoui
Courses Plus Student 13,220 Points
Posted by Tarek El Hinaoui
Tarek El Hinaoui
Courses Plus Student 13,220 Points

shouldn,t be the space between the images equal to the space on the left and right side of each image 2.5% each?

the margin left is 10% which is 2.5% in each side of the image, shouldn´t the space be equal on all sides, when the browser gets wider the space between the images is still the same it does not get wider as the space between the image and the page border.

1 Answer

rydavim
rydavim
18,814 Points
rydavim
rydavim
18,814 Points

I'm not sure what you're asking. In the video, the space between the images in each column does adjust as he resizes the window. If you're not seeing this behavior in your own code, please post your code here and we can help you troubleshoot it.

Keep in mind that the #wrapper has 5% padding on each side as well, so you'll see additional white space on the left and right side of the screen. Adding borders may help you visualize this.

#wrapper {
  max-width: 940px;
  margin: 0 auto;
  padding: 0 5%;
  border: 1px solid red;
}

#gallery {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: auto;
  border: 1px solid blue;
}

#gallery li {
  float: left;
  width: 45%;
  margin: 2.5%;
  background-color: #f5f5f5;
  color: #bdc3c7;
}
Tarek El Hinaoui
Tarek El Hinaoui
Courses Plus Student 13,220 Points
Tarek El Hinaoui
Tarek El Hinaoui
Courses Plus Student 13,220 Points

Thank you very much, i was confused because of the extra space on the left and right side of the page, i missed the 5% padding in the #wrapper, now i understand it.

Washington Bertrand
Washington Bertrand
1,562 Points
Washington Bertrand
Washington Bertrand
1,562 Points

Hi rydavim,

I have followed your instructions on this specific question made by Tarek (since I had the same problem), but even though I followed your instructions, the margin on the right is still smaller than the margin on the right. Im confused as to why this is happening.

rydavim
rydavim
18,814 Points
rydavim
rydavim
18,814 Points

Washington Bertrand - Please create a new topic with your workspace using a workspace snapshot via the camera icon in the top right of your workspace. I'll do my best to help you figure out what's happening.