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
Aakash Srivastav
Full Stack JavaScript Techdegree Student 11,638 Points:only-child
My html is:
<body>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
<li>Item 6</li>
<li>Item 7</li>
<li>Item 8</li>
<li>Item 9</li>
<li>Item 10</li>
</ul>
</body>
And my CSS is:
/* Structural Pseudo-classes------------------ */
li:first-child { background: #52bab3; color: white; }
li:last-child { border: none; }
:only-child { color: tomato; font-size: 1.5em; }
Now according to Guil , ":only-child" styles shouldn't be applied as there are two elements- <h1> and <ul> but what happening is : 1.My "font-size" property gets applied on both the <h1> element and all the <li> element. 2.And Color property doesn't get applied . Whats going on here. Can anyone explain please? Thank You.
1 Answer
Amanda McNeal
9,268 PointsIs it because you are using :only-child instead of li:only-child? Right now, I believe using :only-child is applying to the highest element, which would be <html>, thus the <body> is the only-child of <html> which is why your code is still applying.