W3C home > Mailing lists > Public > www-style@w3.org > April 2015

Would it be possible to have a 'previous' keyword for things like multiple background images...

From: David O'Sullivan <mail@david-osullivan.co.uk>
Date: Mon, 13 Apr 2015 14:23:08 +0100
To: <www-style@w3.org>
Message-ID: <024401d075ec$fba1a1f0$f2e4e5d0$@david-osullivan.co.uk>
This is my first submission so apologies if I am not doing it right!

Anyway my query/proposal is this:

Would it be possible to have a 'previous' keyword for things like multiple
background images so that overriding rules can use the 'previous' setting
from a previous rule and only override what is explicitly set in the
overriding rule?

So for example say I am applying this css:-

..myelement {

  background-image: url(someimageurl), url(someotherimageurl);

}

maybe what I would like to do is override the second image on some occasions
where the element also has the .special class but ALSO inherit whatever the
styles are for .myelement

right now you can do this

..myelement.special {

  background-image: url(someimageurl), url(someNEWotherimageurl);

}

But that will override both images on an element with classes .myelement and
..special.

So what I would not be able to do is change the first image in the first
rule for .myelement and have that change respected in the second rule.

If we had a 'previous' keyword we could do this eg:-

..myelement.special {

  background-image: previous, url(someNEWotherimageurl);

}

That way if the css for .myelement is updated the first image would still
carry through to the .myelement.special but the second image is overridden
by .myelement.special's own style rule for the second image... 

So if we had the 'previous' keyword and we changed the rule for .myelement
to:-

..myelement {

  background-image: url(someimageurl2), url(someotherimageurl2);

}

The result on .myelement.special would be

background-image: url(someimageurl2), url(someNEWotherimageurl);

Right now you can do this for things like padding and border etc because you
can set a generic rule:-

..myelement {

  border-color: red;

}

And a specific rule

..myelement.special {

  border-top-color: green;

}

 

But as far as I know there is no way of specifying something like
'background-image-second'- maybe that would be another better way of doing
it?

 

What do people think? Does specificity work in a way that would make this
easy to calculate without loads of extra overhead?

 



---
This email has been checked for viruses by Avast antivirus software.
http://www.avast.com
Received on Tuesday, 14 April 2015 20:52:36 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:39:30 UTC