Re: [mediaqueries] Queries for image support

Interesting, idea.  Would be fun to generalize a :for(selector)
pseudo-class for styling form element labels.  Eg label:for(:required)

But doesn't address the too-common case where the image icon that failed to
load is a CSS background image or generated content image.

On 21 April 2016 at 10:03, Florian Rivoal <florian@rivoal.net> wrote:

>
> > On Apr 21, 2016, at 15:31, Amelia Bellamy-Royds <
> amelia.bellamy.royds@gmail.com> wrote:
> >
> > For this kind of use cases, especially the first one, I think a pseudo
> class that matches on images that fail to load would be easier to use than
> a media query.
> >
> > An element pseudoclass does have the benefit of applying to broken links
> as well as no-image settings.  Mozilla already has a prefixed pseudoclass
> for this case.  However, it puts constraints on which *other* elements you
> can effect with the selector (needs to be a direct sibling after the
> missing image in the DOM tree).  This limits the use for doing things like
> un-hiding text labels and captions.  Still better than nothing, of course.
>
> Right. Maybe we could make something along these lines to work, and it
> would solve the problem:
>
> <style>
>   label[for] { display: none; }
>   image:failed-to-load { display: none; }
>   label:for(image:failed-to-load) { display: block; }
> </style>
> <label for="foo">This is my nice image</label>
> <img src="....." alt="...." id="foo">
>
>