Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Browser support for CSS :first-child and :last-child

Tags:

Does anyone know which browsers/version support them?

Is it safe to use them, or should I resort to PHP / javascript to generate first/last classes?

like image 252
Alex Avatar asked Oct 29 '11 11:10

Alex


People also ask

How do I use first child and last child in CSS?

The :first-child pseudo class means "if this element is the first child of its parent". :last-child means "if this element is the last child of its parent". Note that only element nodes (HTML tags) count, these pseudo-classes ignore text nodes. This is the div id="test".

How do you select first and second child in CSS?

The CSS child selector has two selectors separated by a > symbol. The first selector indicates the parent element. The second selector indicates the child element CSS will style.

What is CSS last child?

The :last-child CSS pseudo-class represents the last element among a group of sibling elements.


2 Answers

:first-child and :last-child, along with complimentary compatibility chart.

:first-child is supported IE9 properly, and IE7 and IE8 sort of (see chart).

:last-child is supported by IE9+ only.

Both of them are supported well by the good browsers.

like image 67
Bojangles Avatar answered Sep 28 '22 17:09

Bojangles


"Can I use..." should be your go to resource for these types of questions. Here's are the compatibility tables:

first-child - http://caniuse.com/#feat=css-sel2

last-child - http://caniuse.com/#feat=css-sel3

like image 33
Hristo Avatar answered Sep 28 '22 16:09

Hristo