I have not been using SASS for a very long time and wanted to know if there are some issues with pseudo-elements such as :first-child
or :last-child
?
If you want to select and style the first paragraph inside a container, whether or not it is the first child, you can use the :first-of-type selector, which, as the name suggests, will select the first element of its type, whether or not it is the first child of its parent.
Writing Complex :nth-child() Selectors It works exactly the same as :nth-child except that it starts from the end of the parent. For example, you can select the first three children of a parent by using the selector :nth-child(-n + 3) . You can use :nth-last-child(-n + 3) to select the last three.
The :first-child selector allows you to target the first element immediately inside another element. It is defined in the CSS Selectors Level 3 spec as a “structural pseudo-class”, meaning it is used to style content based on its relationship with parent and sibling content.
While @Andre is correct that there are issues with pseudo elements and their support, especially in older (IE) browsers, that support is improving all the time.
As for your question of, are there any issues, I'd say I've not really seen any, although the syntax for the pseudo-element can be a bit tricky, especially when first sussing it out. So:
div#top-level declarations: ... div.inside declarations: ... &:first-child declarations: ...
which compiles as one would expect:
div#top-level{ declarations... } div#top-level div.inside { declarations... } div#top-level div.inside:first-child { declarations... }
I haven't seen any documentation on any of this, save for the statement that "sass can do everything that css can do." As always, with Haml and SASS the indentation is everything.
I think that it is better (for my expirience) to use: :first-of-type
, :nth-of-type()
, :last-of-type
. It can be done whit a little changing of rules, but I was able to do much more than whit *-of-type
, than *-child
selectors.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With