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
Lauren Jones
1,991 PointsCSS Zen Garden
Has anyone looked at the CSS Zen Garden site? And if so, have you thought about working on a project to submit?
I decided I would work on one to practice what I've been learning, and I'm finding it a real challenge. Putting things into use really shows what needs reviewed.
If anyone is working on this too, let's share tips and help each other :)
4 Answers
mark johnson
2,775 PointsWhat specifically are you having trouble putting together? Am not exactly working on anything right now but i have a bit of experience.
mark johnson
2,775 PointsGreat that's good, that's the fun of learning is solving your problems. Once you figure it out you'll never forget how to do it. Good luck in your future endeavors!
Lauren Jones
1,991 PointsWell, now I could actually use some help. Here's what I have right now. The basic layout result is what I want, but it only displays properly on certain screens, and I know there's a better way, I just don't know what it is.
Without spoon-feeding me, could somebody point me in the right direction? The sidebar is pretty good where it is, but I'd like the other divs evenly (and reliably) spaced and the footer right below everything else.
Would just using em instead of px do the trick? Or should I be going at the positioning entirely differently?
mark johnson
2,775 PointsThere are several things you can try to solve your problem. You can try adding some bottom margin the the divs. You can also create a class and add that class to each div then style that class in your css and each one of your divs with that class will have the same style applied to it. As far as the footer try clear both property to push it down the bottom. Those should point you in the right direction.
Lauren Jones
1,991 PointsCSS Zen Garden doesn't allow changing the html, but I'll try the other things and see how far I can get. Thanks!
Lauren Jones
1,991 PointsOkay, so I've rewatched the box model and positioning videos, and I know there has to be something I'm missing, but I just can't get this to work. Here is the current version, which looks okay in Safari, but not in Firefox. If I give the divs position: absolute; then the sidebar will display beside them like I want in Firefox, but the divs all stack (in both Safari and Firefox). The only way to then unstack them is to manually position them n pixels from the top, which doesn't display properly across various screen sizes.
I'm sure there's some simple reason these boxes won't go where I want but I just can't seem to get it. I've tried every combination of position: display: and float: that I can think of and each one has some issue.
Help anyone?
Lauren Jones
1,991 PointsLauren Jones
1,991 PointsRight this second everything is working out okay, I've just found it to be a challenge in general. Not being allowed to change the html has proven to be frustrating, and I found myself spending a lot of time tweaking things to get the result I wanted.
It took about a half hour just to get the sidebar to actually display next to the other divs, rather than under them for some reason.
I'm having fun playing around, though.