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 CSS Basics (2014) Basic Layout Basic Layout Review

John Erickson
seal-mask
.a{fill-rule:evenodd;}techdegree
John Erickson
Full Stack JavaScript Techdegree Student 3,916 Points

CSS - Basic Layout

Unlike most posts, this is not your typical straight forward question, however I figured I'd reach out to the community in hopes of better understanding how to tackle some confusion. I'm new to CSS and I'm currently undertaking the CSS Basics course. For the most part I'm really enjoying the subject material and although I'll hit a snag here and there understand the concepts. However, I hit a brick wall when going through the Basic Layout section.

With the introduction of width and height, size and position, pixels, em, rem, percentages (all of which impact content differently by their parents content) I'm pretty confused. I plan on going through this section all over again and more so I plan on trying things on my own. Anyway, while the instructor is AWESOME I personally feel this section is quite confusing. Is there any resource one would suggest to help a new CSS designer better understand when to use what measurement method and how content is impacted by it's parents content?

Any help would be greatly appreciated.

Thanks, John

3 Answers

I have to agree with Ante. The two sites suggested are perfect! css-tricks and mdn are the most preferred sites to reference, for css, and beyond. mdn should always be a go to. I will also suggest stackoverflow.com. its a forum like treehouse, and a great resource. The main thing is if you don't know find and use the resources to find the answer, for css, css-tricks is great! also use codepen.io its fantastic, you can see experts code and create your own as well. its a world wide version of workspaces and you can see how people build. Lastly, remember if your stuck, give it a go first, google your way out of it, ask questions. We're here to help, and I think the community here is top notch. I hope this helps, and good luck!

John Erickson
seal-mask
.a{fill-rule:evenodd;}techdegree
John Erickson
Full Stack JavaScript Techdegree Student 3,916 Points

Thanks a ton Jacob and sorry for the delayed response. As I mentioned to Ante, I'm bouncing between learning HTML/CSS and JavaScript. Lately I've been gong through a ton of resources on JavaScript in prep of starting a web development bootcamp. It's been a struggle as I feel I'm doing nothing, but learning theory and not application. Regardless, I'm having a lot of fun and I really look forward to the time things really start to connect. Again, thanks for the feedback.

Ante Vujčić
Ante Vujčić
11,306 Points

Hi, I find the best way to understand is practicing as you probably already heard in course, but you should try practice every element you learn and play with its values to see how it actually works. Some of websites where you can learn more are css-tricks.com and mdn.com and so on but this two are great because they have every example shown. enjoy coding

John Erickson
seal-mask
.a{fill-rule:evenodd;}techdegree
John Erickson
Full Stack JavaScript Techdegree Student 3,916 Points

Thanks Ante and sorry for the delayed response. I've been bouncing between teaching myself HTML/CSS and JavaScript. Regardless, I've heard and bookmarked css-tricks, however haven't spent much time on the site. Thanks for the feedback. Trust when I state I greatly appreciate it.

Jason Milfred
Jason Milfred
5,968 Points

This is a nice introduction to CSS layout. Learn CSS Layout