<div style="background-position: 25% 75%">
<div id="target" style="background-position: inherit;"></div>
</div>
<div style="background-position: right 25% bottom 75%">
<div id="target2" style="background-position: inherit;"></div>
</div>
<div style="background-position: bottom 75% right 25%">
<div id="target3" style="background-position: inherit;"></div>
</div>
<p>
This tests that <tt>background-position: inherit</tt> is applied correctly.
</p>
<p id="result">
</p>
<script>
if (window.testRunner)
testRunner.dumpAsText();
var targetBackgroundPosition = getComputedStyle(document.getElementById("target")).backgroundPosition,cssText;
var result = document.getElementById("result");
result.innerText = targetBackgroundPosition == "25% 75%" ? "PASS" : "FAIL: The inherited value was " + targetBackgroundPosition;
result.innerText += "\n";
var targetBackgroundPosition2 = getComputedStyle(document.getElementById("target2")).backgroundPosition,cssText;
result.innerText += targetBackgroundPosition2 == "right 25% bottom 75%" ? "PASS" : "FAIL: The inherited value was " + targetBackgroundPosition;
result.innerText += "\n";
var targetBackgroundPosition3 = getComputedStyle(document.getElementById("target3")).backgroundPosition,cssText;
result.innerText += targetBackgroundPosition3 == "right 25% bottom 75%" ? "PASS" : "FAIL: The inherited value was " + targetBackgroundPosition;
</script>