There is a parent div
with id = "cooldiv"
. It has many div
elements inside. Now I need to set a css property to all the child div
-s except the first one.
So, this is what I've tried so far to accomplish this task:
#cooldiv .row:not(first-child) {
top: -50px;
}
But, of course, it didn't work out. What's wrong here? This is the screenshot of the source code:
The :first-child selector is used to select the specified selector, only if it is the first child of its parent.
This selector is used to select every element which is not the first-child of its parent element. It is represented as an argument in the form of :not(first-child) element. Explanation: The above example shows that a <div> is a container Tag.
The :first-of-type selector in CSS allows you to target the first occurence of an element within its container. 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.
By using the :not(:first-child) selector, you remove that problem. You can use this selector on every HTML element. Another common use case is if you use an unordered list <ul> for your menu.
Try #cooldiv .row:not(:first-child)
. It seems you missed :
before first-child
. Maybe that's why it doesn't function?
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