pseudo element capabilities
Hey, is there anything that a pseudo element can't do that a normal element can? I know this is quite broad, but is there perhaps certain properties that wouldn't work on them etc? Thanks in advance.
16 Replies
well, the contents of a pseudo element can not be read by a screenreader
all other properties will probably work (but that's a broad answer as well)
yeah that's true. is that about all the limitations you reckon?
can not think of something else, but for a better answer, i need more
You can’t give the content any HTML, it can take a string for example but can’t do something like this:
But you can use an attr for the content property which is a fun one !
yeah that's fair enough. i was more just wondering about limitations
oh yeah true, and then you can't style the attribute content seperately like in your example either. so i guess a limitation is being unable to style
content contentYou can’t :hover ( or similar) on pseudo elements (not a property but worth taking into account)
oh yeah, i'm pretty sure you can style them on hover of the parent though which is useful
you cant attach events
Oh with js?
yup
you also can't use it as an element in javascript
you can access the styles set, but that's it
Ah okay, I didn’t know that
pseudo-elements are weird
They're not quite in the DOM
In what way? The fact they’re not in the accessibility tree?
in that they're not accessible by JS because they're not really quite part of the DOM
Ohh okay