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

HTML

Id or Class, wrapping

Hi guys,

I understand id's can only be used once and classes can be used over and over. i don't understand though when i should use the id? you only have one container div but all examples so the container div as a class?

Second question i have is if i am making a form and i want to make it like an inline block with say, Username text area and a example saying "e.g. miguel77". do i have to wrap each piece of information to get the fields on there own lines.

Thanks

Miguel Barbosa

4 Answers

Question 1: ID's come into play a lot more when you start integrating Javascript and other code to very specific elements. ( ex: $('#btnSendForm').click(); )

Otherwise, it's good practice to use classes so you can easily reuse elements later if you need to, without accidentally creating conflicting IDs. There's no "official" way of choosing though, and often it comes down to personal preference.


Question 2: No, I would just wrap the entire contact form itself. You could wrap the individual pieces if you wanted to, but it would be cleaner to just use CSS to style it. See if one of these is what you're looking for: http://jsfiddle.net/Ufu2R/ http://jsfiddle.net/Ms9UX/

Good luck!

Thanks Neal for your reply. Much appreciated. The first link is the one i am looking for however I wanted a little example at the end of the text field on the same line would i use a <p> or a header tag?

Thanks again.

Wayne Priestley
Wayne Priestley
19,579 Points

Hi Miguel,

Q2: If you want to give an example of what you expect in the text field you could use a placeholder attribute.

<label for="username">Username</label>
<input type="text" name="username" id="username" placeholder="Holder">

this would insert the word Holder in the text area which would disappear once the user starts to enter text.

Julian Price
Julian Price
11,760 Points

Hi Miguel:

I believe CLASSES should be used more for GLOBAL STYLE/FORMAT ID used to change highlighting a particular element on the page