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 Foundations Selectors Link and User Action Pseudo-Classes

daniela
daniela
2,629 Points
Posted by daniela
daniela
2,629 Points

input:focus a valid command?

At 7:48 under line 52, the video shows input:focus, but when it goes back to the same area at 8:24 under the same line, the video shows a:focus instead.

I understand the purpose of a:focus to target the links, but do not understand input:focus as it being a valid command. I assume it is a glitch in the video, but just in case, can someone explain? Thanks!

4 Answers

David Wible
David Wible
7,473 Points
David Wible
David Wible
7,473 Points

I am on my phone so can't go into great detail but yes, you can use input:focus. Read this for some pseudo class info. http://css-tricks.com/pseudo-class-selectors/

David Tonge
PLUS
David Tonge
Courses Plus Student 45,640 Points
David Tonge
David Tonge
Courses Plus Student 45,640 Points

input:focus is, in fact, a valid selector. Let's say I had a form that required text input, but I wanted the user to be aware that they selected the correct text-field, I'd use input:focus to signal a change when the text-field or label is clicked.

daniela
daniela
2,629 Points
daniela
daniela
2,629 Points

David,

I think I understand from the link you sent. The video was referring that input:focus targets form elements that a user could input something like the username or password areas of the form. The a:focus targets only the a parts of the page, and so on. I think it was just confusing in the video to say that, or maybe there was a small glitch between what was actually typed and what was shown. Thanks for the link!

Daniela

Ricardo Hill-Henry
Ricardo Hill-Henry
38,442 Points
Ricardo Hill-Henry
Ricardo Hill-Henry
38,442 Points

Input focus would refer to an input field that is currently selected. For example, when you're filling out a form, and you tab or click into an area that area gets "focus." You'll see this a lot when you get into Javascript, and probably use Javascript to handle focused elements opposed to CSS. But for the most part, any element that can be clicked in or tabbed into (form fields, logins, etc.) can receive focus; with the exception to links.