It's 2022 and #CSS :only-child isn't aware of text nodes?
I'm trying to select an image that is the only direct descender of an element, with no text node siblings, e.g.:
<div><img/></div>
Not
<div>Hello<img/>World</div>
div img:only-child will select this img in both cases, as will div img:first-child and div img:last-child
Am I missing something?
@m2m I think not. I've also been resisting the compulsion to wrap `code` with backticks! 😅
@m2m Yeah I was hoping to avoid needing to use extra markup. It's frustrating because the Javascript DOM knows about TextNodes, but CSS is like "🤷🤷🤷"
@omgmog maybe this:
https://developer.mozilla.org/en-US/docs/Web/CSS/::target-text
though it's experimental and lack widespread support. Also, I'm not entirely sure it's what you're looking for.
@omgmog no, scrap that, it's not what you're looking for 😆
@m2m haha thanks for looking! I will just have to resolve to not being able to do what I wanted
@omgmog Because that'd quickly became a pain as HTML often has whitespace (which are also text nodes) between elements:
<div class="a">
<div class="b">...</div>
</div>
Nobody wants to deal with that.
@omgmog I never stumble on a case like this, probably because I have a compulsion not to leave a text node untagged. In your second example I would have had:
<div><span>Hello</span><img/><span>World</span></div>
And, off-topic: do we have markdown in Mastodon? I had to refrain from wrapping the above code within ``