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
Bob Goldsmith
5,444 PointsCan anyone explain the white space issue further?
In the Column Layout with Inline-Block video, the columns only sit side by side when margin-right: 5px; is applied to them in the CSS. I understand that the initial problem is due to white space in the HTML being interpreted by the browser, but why is it 5px exactly and how does that relate to font size?
If I increased or decreased the body font size, how would I calculate the new margin-right value?
3 Answers
Jason Anello
Courses Plus Student 94,610 PointsI think it's a trial and error type thing. The gap that appears between the elements is a single space. So the number of pixels you use has to match the width of a single space. That width would be dependent upon the font you used and the font size. For example, the space on a monospaced font would probably be wider than a space with say, Times New Roman.
Here's some other ways to deal with it:
http://css-tricks.com/fighting-the-space-between-inline-block-elements/
Bob Goldsmith
5,444 PointsThanks Jason. Much appreciated.
Guil Hernandez
Treehouse TeacherAlso, take a look at this related forum thread.