Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /css/css-backgrounds/background-size-026.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Test: background-size 'auto' with background-repeat 'repeat'</title>
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2012-11-14 -->
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" title="3.9. Sizing Images: the 'background-size' property">
<link rel="match" href="reference/background-size-026-ref.xht">
<meta name="flags" content="image">
<meta name="assert" content="Check if 'background-size' is 'auto' and 'background-repeat' is 'repeat', that the background image is shown at its intrinsic size (98px wide by 99px tall in this test) and repeats in both horizontal and vertical to cover the background painting area (the same as background positioning area in this test).">
<style>
div {
background-color: red;
background-image: url(support/cat.png); /* 98px wide by 99px tall */
background-repeat: repeat; /* default */
background-size: auto; /* default */
height: 198px;
width: 196px;
/*
Background positioning area is 196px wide by 198px tall.
So, the image should be repeated twice in horizontal and vertical.
*/
}
</style>
</head>
<body>
<p>Test passes if there is 2 rows of 2 cats and if there is <strong>no partially</strong> displayed cat and <strong>no red</strong>.</p>
<div></div>
</body>
</html>