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
ammarkhan
Front End Web Development Techdegree Student 21,661 PointsWhy wasn't a , used to separate out .button class?
As i go through the video i am confused to see one property which is as follows
.photo-overlay:hover .button{
opacity:1;
}
my question is shouldn't it be css .photo-overlay:hover , .button{} and if not, css is cascade meaning last rule is important and override previous one (if with same class). So why .button remain opacity 0 and why not 1?
1 Answer
Steven Parker
231,235 Points
This is an example of a descendant selector.
When two terms are separated by a space, the complete expression is a descendant selector. This means an element matching the term on the right will be targeted, but only if it is contained by (is a descendant of) an element matching the term on the left.
So the selector in this example will target an element having the class "button" when it is contained by another element with the class "photo-overlay" — and only while the mouse is hovering over it.
If a comma had been used, each term would be taken as a separate selector and both would be targeted.
ammarkhan
Front End Web Development Techdegree Student 21,661 Pointsammarkhan
Front End Web Development Techdegree Student 21,661 PointsThanks.