background-size-specificity.html

<!DOCTYPE html>
<html>
<head>
<title>background-size specificity</title>
<link rel="stylesheet" href="c/style-insert-tests.css" type="text/css">
<style type="text/css" media="all" id="tests" contenteditable>
div {height: 300px; width: 600px; border: 1px solid silver; margin: 3em 0;}
div b {padding: 0 0.25em; font-weight: normal;
	position: relative; top: -1.15em; border: 1px dotted silver; border-bottom: 0;}

#d1 {
	background: url(i/yinyang.png) top left no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	}
#d2 {
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background: url(i/yinyang.png) top left no-repeat;
	}
</style>
</head>
<body>

<div id="d1"><b>d1: shorthand, then background-size</b></div>
<div id="d2"><b>d2: background-size, then shorthand</b></div>

</body>
</html>