-
Notifications
You must be signed in to change notification settings - Fork 756
Open
Labels
Description
I am missing sort of the immediate sibling selector but for children instead of siblings.
Something like article ~> p
A theoretical article ~> p:first-of-type::first-letter would solve the following difficulty I encountered, for which I could come up with not other elegant method.
https://jsfiddle.net/r0k0eoza/24/
<div class="wrap_page">
<div class="some_other_wrapper">
<article>
<header>
<p>
This text should NOT have its first letter selected
</p>
</header>
<img src="test.jpg" alt="some element of another type to demonstrate something standing in the way of an easy solution">
<p>
This text should have its first letter selected
</p>
<p>
This text should NOT have its first letter selected
</p>
<main>
<p>
This text should NOT have its first letter selected
</p>
</main>
<p>
This text should NOT have its first letter selected
</p>
<p>
This text should NOT have its first letter selected
</p>
<section>
<p>
This text should NOT have its first letter selected
</p>
</section>
<footer>
<p>
This text should NOT have its first letter selected
</p>
</footer>
</article>
</div>
<footer>
<p>
This text should NOT have its first letter selected
</p>
</footer>
</div>
<article>
<p>
Just to be complete, this one should be selected
</p>
</article>
.wrap_main p:first-of-type::first-letter, article p:first-of-type::first-letter { color: red; }
Edited because I wrote the first example of the issue without coffee. (messed up)