Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS :last-child not working

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #183546
    Anonymous
    Inactive

    I want to select the last child of elements with a specific attribute.

    The :first-child is working, but the :last child isnt. What can possibly be causing this?

    .element[element-type='circle']:first-child {background:red}
    .element[element-type='square']:last-child {background:red;}
    <code></code>

    #183563
    Paulie_D
    Member

    I want to select the last child of elements with a specific attribute.

    You can’t…with CSS

    Pseudo-selectors like :last-child or nth-child or nth-of-type only select based on elements not classes or attributes.

    Either something is the last-child or it isn’t. If it’s the last element in a parent it will be selected.

    Remember that CSS reads ‘right to left’

    So, in your case, it’s testing for it to meet all the conditions.

    It looks to see if something is the last child then if it has the attribute and class. If it doesn’t have all three…in that order…it fails.

    The :first-child is working

    My guess it that this is just by chance….the element just happens to be the first element in the parent. You can test this for yourself by adding an extra element in front, temporarily, to your code.

    JQuery can do this selector for you though.

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.