Re: [whatwg] <di>? Please?

Shouldn't this do the job?

dd {
    display:none;
}
dt:focus ~dd {
    display:block
}
dt:focus ~ dt ~ dd {
    /* Hides again any dd that follows a dt that follows the focused dt */
    display: none;
}

The feature you are suggesting sounds interesting, but your use case seems
to be solved by already existing features.

Regards,
Edu Pascual

On 22 November 2014 at 00:16, Young, Brennan <Brennan.Young@laerdal.dk>
wrote:

> Just run into a problem which I expected to be relatively common, but
> apart from this thread, I have found little discussion about it, or any
> indication that the proposed CSS level 4 selectors will present a solution.
>
> Ian Hickson wrote "(Though really, how often do you have a collapsible
> dt/dd group that has  more than one dt or dd?)"
>
> .... not often, but it's a valid case. I am sitting with exactly such a
> case right now.
>
> For example, I have a quite large definition list with hundreds of
> entries. In this case, dt appears only once for each entry, but there are
> multiple (and variable numbers of) dds.  Something like this:
>
> <dl>
>     <dt>Foo</dt>
>     <dd>Egg Foo Yung</dd>
>     <dd>Football</dd>
>     <dd>Foolishness</dd>
>
>     <dt>Bar</dt>
>     <dd>Barry Manilow</dd>
>     <dd>Barchester Chronicles</dd>
>
> </dl>
>
> I want the dds to be hidden. I'd like to be able to click on (or tab
> through to) a dt, giving it focus, and then its corresponding dds should
> become visible.
>
> I hoped to do
>
> dd {
>     display:none;
> }
> dt:focus ~dd {
>     display:block
> }
>
> .... but this will show *all* subsequent dds after the focused dt.
>
> It's been suggested that I give a class to each 'group' of dts and dds,
> which works today, but this will bloat my css file in proportion to the
> length of the list. I mentioned that the list is very long? There are also
> multiple documents with comparably long lists, and I want them to share the
> same css file. So, the class/id solution is not great.
>
> dt:focus + dd and variants with additional + selectors are not good
> because I don't know how many dds there will be.
>
> One solution proposed here is to add markup, either by permitting div or
> li inside dl, or by introducing the mooted di (the subject line of this
> thread).
>
> But this seems messy, considering that the browser already knows how to
> associate dts with dds. So I agree with the view that this should be solved
> in css, not in markup.
>
> (I will use a javaScript workaround today, of course, but this is a
> presentation issue, and therefore CSS should be able solve it).
>
> What I am looking for is a selector, somehow similar to the sibling
> selectors ~ or +, but which 'stops' selecting siblings when an element of a
> different type appears.
> In this case it might select all subsequent dds until something that is
> not a dd appears.
>
> jQuery's nextUntil() offers something similar. That feature would not have
> been added if there were no use case for it.
>
> I suppose it might otherwise be imagined as a kind of 'contiguous'
> selector'. Select one element, and all contiguous sibling elements of the
> same type will get selected.
>
> Could also be used to select all paragraphs following a heading, up until
> the next non-paragraph etc.
>
> Obviously not a formal proposal, but does this appear reasonable? Are
> there any other fantasies?
>
>
>
>
>
>
>