Hi!
I have a question about Relative Styling.
I have a div that contains a few sentences with the paragraph tag (p). I want the styling to target the P tag, the last child, and the first child. How do I do it with relative styling?
Example:
.classforthediv p:first-child
.classforthediv p:last-child
I can do this with custom CSS, but I’d love to know how I can do this with relative styling. How should I configure the setting?
Thank you!
Hey @jornes.
You can set it up like this:
Since :first-child isn’t available as a pseudo class (probably for a reason), I decided to go with *-of-type instead, which should you give the same result.
Hope that helps.
I was wondering why last-child wasn’t working. Glad to know there is an alternative
Hey @nadim.
Thanks for sharing your experience.
While using the *-child pseudo class will reflect your styles accordingly on the front-end, one needs to know that the back-end might show some inconsistencies.
You can read about this issue here.
Targeting elements more precisely with the *-of-type pseudo class instead will result in a more consistent experience.
I know it’s not an optimal solution, but we will probably (well, hopefully) see improvements in that regard down the road.
Hey @Marius
Thank you!
So, when the time I do this, I choose the paragraph instead of the div, correct?
You want to choose the div, as you can see in the screenshot which is based on your example from your original post.
You are able to control the first and last paragraph from a single Relative Style then.
