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
mrx3
8,742 PointsJust finished my practice site. I would like some ideas if you have time?
I've been practicing around with the concepts I've learned from Nick, Guil, and you people on the forum. My CodePen link is below for my page. I was wondering what you think of CSS and Markup Language? For instance is there anything you would change, is CSS grouped right, or anything else you can come with that's wrong with?
I know the colors are not the best, and it's not very interactive like most of the sites on the Internet. It's just for practice, and fun. I really enjoy making these sites, and learning on this site. Thanks in advance for the help and any comments.
CodePen: http://cdpn.io/zEtjJ
3 Answers
Ben Dietrich
3,604 PointsMr. X this is a great start! I'm in a similar spot in my learning so it was helpful for me to take a look through your work.
A couple of things I noticed....
One thing that initially caught my eye was a bit of a spacing issue with your nav. It appeared to be off-center to the right ever so slightly. I didn't have time to figure out the culprit in the CSS but there is something amiss.
A suggestion I would make when organizing your CSS is to group it by page section, flowing from top to bottom. It's really all personal preference but I like to have my general rules at the top, then focus on the main sections of your site, moving progressing downward. Header, nav, footer, colors, etc. Also, it may be helpful to create a bit more visual separation between your comments and actual CSS.
Lastly, and this is more of a suggestion for when you get into bigger projects, but I'd take a look at your HTML indentations. They made the code a little difficult to follow at times.
A question I had for you too...did you add the nav class=nav for a specific reason? I'm still a novice myself and I found that curious.
Keep up the great work!
mrx3
8,742 PointsThanks for the kind comments! I don't really know why I gave it a class, I should have just left it nav. I did notice as well that my nav is a little off center, I've been doing some research on line and looking for at other examples. I to try to make the CSS like you mentioned, Start at the top, and work my down. I just made a practice resume site with a background like this: http://html5up.net/twenty and this: http://w3layouts.com/wildflat-corporate-flat-responsive-web-template
These two sites I found are awesome, I love they way they look. I made the menu exactly like you see here. Sometimes the HTML gets large that it's hard to keep everything in order, and I need to focus on exactly what you said, "Try to keep a little more organized. Thanks again for the kind comments Benjamin!
Ben Dietrich
3,604 PointsJust figured out the positioning issue with your nav. Add padding to your nav ul selector with a value of 0 to reset the padding and center the nav. Like this...
nav ul {
margin: 0;
padding: 0;
}
mrx3
8,742 PointsThanks Benjamin!!! Much appreciated!!!!!
Ben Dietrich
3,604 PointsNo problem. If you need another review just let me know!
Richard Duncan
5,568 PointsRichard Duncan
5,568 PointsThe markup and CSS look good to me, I can't see any issues it's nice and clean you've kept it separate which is good.
If I were you in terms of the next step maybe think about adapting this to make a responsive design, or changing the footer so that it is flush with the bottom of the page regardless of the content depth or both.
Solid work though keep it up!