W3C home > Mailing lists > Public > www-style@w3.org > March 2012

Re: :first pseudo-selector

From: Marat Tanalin | tanalin.com <mtanalin@yandex.ru>
Date: Thu, 22 Mar 2012 22:37:24 +0400
To: fantasai <fantasai.lists@inkedblade.net>
Cc: "www-style@w3.org" <www-style@w3.org>
Message-Id: <778781332441444@web58.yandex.ru>
> It's necessary if you have a box with some paragraphs and don't want to have unnecessary gaps at the the end and the beginning
> of the box.

As far as I understand this part of message, it's something that I thought of too.

Let assume we have a container with blocks inside it, and each block can have margin-top and margin-bottom, and each block can contain another blocks inside them, and nesting level can be arbitrary and is unknown in advance.

It would be nice to have ability to zeroize margin-top for first child, and first child of it, first child of first child of first child, etc. at once. Same applies for last child.

Currently, AFAIK, we can only match children up to some _exact_ nesting level known in advance (3 in the example below):

    .container > :first-child,
    .container > :first-child > :first-child,
    .container > :first-child > :first-child > :first-child {}

We cannot use just :first-child context selector since it would also select first children of blocks that are not first children themselves.

So we need a sort of _recursive_ selector that matches not just first of last child, but recursively matches all first-most and last-most elements regardless of their nesting level.

A possible syntax is quite straightforward:

    :first-child-recursive {margin-top: 0; }
    :last-child-recursive  {margin-bottom: 0; }

Thanks.



22.03.2012, 04:24, "fantasai" <fantasai.lists@inkedblade.net>:
> -------- Original Message --------
> Subject: :first pseudo-selector
> Date: Wed, 02 Nov 2011 23:12:16 +0100
> From: Daniel Bock <daniel.bock@web.de>
> To: tantek@cs.stanford.edu, fantasai.lists@inkedblade.net, daniel.glazman@disruptive-innovations.com
> CC: bert @w3.org, howcome @opera.com
>
> Hello,
>
> I'm eighteen years old, go to school yet and develop web applications in my spare time.
>
> Currently I'm using the following CSS as a workaround:
>
> ššššš:first-child, noscript + :nth-child(2) {
> ššššššššmargin-top: 0;
> ššššš}
>
> ššššš:last-child, noscript + :nth-last-child(2) {
> ššššššššmargin-bottom: 0;
> ššššš}
>
> But it would be much easier to use the ":visible:first" pseudo-selector for this, which is e.g. used in jQuery.
>
> http://api.jquery.com/first-selector/
>
> It's necessary if you have a box with some paragraphs and don't want to have unnecessary gaps at the the end and the beginning
> of the box.
>
> I hope you can include this feature into the offical CSS 3 specification. Please inform me about the progress of my request.
>
> With best regards,
> Daniel Bock
Received on Thursday, 22 March 2012 18:38:00 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Tuesday, 22 May 2012 03:48:53 GMT