Proposal: ("background") to ("background-image" and "background-position") separation

[Kainax]

We can optimize this:

#icon01{background:url(../images/subfolder/long_icon_sprite_name.png)0px 0px}
#icon02{background:url(../images/subfolder/long_icon_sprite_name.png)0px -16px}
#icon03{background:url(../images/subfolder/long_icon_sprite_name.png)-16px 0px}
#icon04{background:url(../images/subfolder/long_icon_sprite_name.png)-16px -16px}

and so on...

to this:

[id^=icon0]{background-image:url(../images/subfolder/long_icon_sprite_name.png)}
#icon01{background-position:0 0}
#icon02{background-position:0 -16px}
#icon03{background-position:-16px 0}
#icon04{background-position:-16px -16px}

and so on...

[lahmatiy]

Producing an attribute selector (e.g. [id^=icon0]) is unsafe and quite tricky. Value extraction looks good option, but requires more knowledge about property value structures that we haven't yet.