| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>background-position: 2-value on top of 4-value</title> |
| <style> |
| body { margin: 0 } |
| .test1 { |
| height: 200px; |
| width: 200px; |
| background-image: |
| url(../../css3/images/resources/red-100.png); |
| background-repeat: no-repeat; |
| |
| /* Intended to be overwritten: */ |
| background-position: bottom 0% right 0px; |
| } |
| .test2 { |
| /* The background-position to be used: */ |
| background-position: 0px 0px; |
| } |
| .ref { |
| height: 100px; |
| width: 100px; |
| top: 0; |
| left: 0; |
| background-color: green; |
| position: absolute; |
| } |
| </style> |
| </head> |
| <body> |
| <div class="test1 test2"></div> |
| <div class="ref"></div> |
| </body> |
| </html> |
