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
Jakub Tyczyński
3,310 PointsThere is no type="button", so why do we traget it?
I've noticed that teacher target type="button", for adding a coursor:pointer, while there is no such type in the index.html. Removing this selector has no effect, coursor pointer is still there on all buttons. So what is the purpose of writting this selector?
input[type="button"],
input[type="reset"],
input[type="submit"] {
cursor: pointer;
}
<div id="container">
<form class="form-contact">
<h1>Contact</h1>
<label for="name">Name:</label>
<input type="text" id="name">
<label for="email">Email:</label>
<input type="email" id="email" placeholder="email@website.com">
<label for="msg">Message:</label>
<textarea id="msg" rows="7"></textarea>
<input type="submit" value="Submit">
<input type="reset" value="Reset">
</form>
<hr>
<img src="img/avatar.png" alt="Mountains">
<form class="form-login">
<label for="username">Username:</label>
<input type="text" id="username">
<label for="password">Password:</label>
<input type="password" id="password">
<input type="submit" value="Login">
<a href="#" target="_blank">Forgot your password?</a>
</form>
</div>
5 Answers
Jonathan Grieve
Treehouse Moderator 91,252 PointsIt just means that the pointer will target a button type if one is created in the HTML. We're getting ourselves prepared in case we want to use a button instead of using one selector in our rule, we can group them because they do the same things. :-)
Jakub Tyczyński
3,310 PointsOK, thanks for help!
erikanicosia
7,788 PointsI was wondering the same thing, and then I looked again at the html code. Could it be that there is a type-o in the code that was provided? For the login button (line 38 of the html code), the type is "submit", which is also the type for the submit button (on line 24 of the code). Not that it really matters, because the styling works anyway :)
Ubo Town
3,227 PointsI have the same doubt. read everything, but still don't understand.
Ubo Town
3,227 PointsI have the same doubt. read everything, but still don't understand.
Jakub Tyczyński
3,310 PointsJakub Tyczyński
3,310 PointsSo this means that in this case, input[type="button"] selector is not needed and is added only for future use. Do I understand it right?
Jonathan Grieve
Treehouse Moderator 91,252 PointsJonathan Grieve
Treehouse Moderator 91,252 PointsI'd say so but if I were you I'd leave it in for the time being until you know it's not going to be used. Maybe Guil has a use in mind for it somewhere in the future, I can't quite rememeber.
It's up to you how you approach it though but for me, you can take care of these sorts of things in "code cleanup". :-)
Brian Pohuski
5,386 PointsBrian Pohuski
5,386 PointsFor additional future-proofing, add a CSS selector for the HTML5 <button> element as well. The default action for a button is to submit when within a form if no other type attribute is specified. So, there is possibility that the <button> element will be using instead of
<input type="submit" value="foo">With proper parent selectors in place, this will future-proof without changing other button styles. :D More reading if interested: https://davidwalsh.name/html5-buttons
Quinton Shuman
7,068 PointsQuinton Shuman
7,068 PointsIf this is the case then I would've appreciated Guil saying so during the video. I was thinking the complete opposite. I was thinking that putting in "reset" and "submit" must have some default "button" value that is just there to begin with and that "input[type="button"]" was already targeting them, rendering "input[type="reset"]" and "input[type="submit"]" useless redundancy. I suppose I could just be being pedantic but if I do something I want to understand what I'm doing not just know that I'm doing it.