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
Arthur Kakulidis
2,657 PointsHTML & CSS Chaos
I know html and css pretty well, but there are a few problems. First, my code is all messed up, and I can't read it few days later. Second problem is that I'm very confused with margins. If I change the margin of one element, margins of other elements get messed up. Can someone please direct me on to the right path with spacing, since I'm starting to get confused and frustrated.
2 Answers
Steven Parker
231,248 PointsIt would help if you show a specific example to illustrate what you mean by "all messed up".
An example of your margin issue would also be helpful, but in the meantime one aspect of margin interaction that is often confusing is called margin collapse. There's a discussion of it on the MDN page Mastering margin collapsing, and also in this article on CSS Tricks called What You Should Know About Collapsing Margins. There's plenty other references online but those are two of my favorites.
Be sure to post a code example if you're still having problems.
mryoung
4,156 PointsThe best advice for learning margins and padding is to give all your elements a red border. Then you can use the console to see the margins and padding and how each is aligned within one another. After that, it’s a matter of creating a look you want to emulate by trial and error.
YouTube and treehouse videos helped immensely too. Divs are like a room, and inside that room are elements (like a heading or paragraph), and you can either move the entire div around (margins, padding, etc) or move a single element around. Perhaps you’re moving the parent div when you’re trying to move an element?
Think of margins as the same way you’d think of a margin on a piece of paper - it’s pushing away from other objects (the margin on paper pushes the text away from the edge), and padding fills in more white space inside the paper (like if you could stretch the paper outwards from the element).