19142 2012-09-29 14:37:54 +0000 multiple values of backgrounds, shadows aren't so "cascading" 2012-09-29 14:37:54 +0000 1 1 1 Unclassified CSS Cascading and Inheritance unspecified All All NEW P2 normal --- 1 giorgio.liscio howcome public-css-bugzilla oldest_to_newest 74875 0 giorgio.liscio 2012-09-29 14:37:54 +0000 hi, there is something wrong about the multiple background and multiple shadows syntax #mybutton { background: url('bg1.png') left top no-repeat, url('bg2.png') left bottom no-repeat, url('bg3.png') right top no-repeat, url('bg4.png') right bottom no-repeat, url('bg5.png') center center no-repeat, red ; } now, for an effect on this I have to completely rewrite the entire value #mybutton:hover /* HOVER */ { background: url('bg1.png') left top no-repeat, url('bg2.png') left bottom no-repeat, url('bg3_HOVER.png') right top no-repeat, /* CHANGES ON HOVER */ url('bg4.png') right bottom no-repeat, url('bg5.png') center center no-repeat, red ; } then maybe, it would be better to study an alternative method of setting a single value of a stack of values: #mybutton:hover /* HOVER */ { background(3): url('bg3_HOVER.png') right top no-repeat; /* this is ^ the background slot */ } any syntax, even if a lot complex, would be better than completely rewrite the stack of backgrounds this should be applied, also, on box-shadow and text-shadow properties #mybutton { text-shadow: 0 0 20px red, 0 0 10px blue, 0 0 20px lime, 10px 10px 10px pink; box-shadow: 0 0 20px red, 0 0 10px blue, 0 0 20px lime, 10px 10px 10px pink; } #mybutton:hover { text-shadow(2):0 0 20px purple; box-shadow(2):0 0 20px purple; }