servo/tests/wpt/web-platform-tests/css/css-backgrounds/border-image-slice-006.htm

25 lines
No EOL
2.6 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Test: The 'border-image-slice' property with '100%' as a value</title>
<link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-slice" />
<meta name="flags" content="image" />
<meta name="assert" content="This test checks that if the sum of the right and left widths of the regions given by the 'border-image-slice' values is equal to or greater than the width of the image, the images for the top and bottom edge and the middle part are empty. Analogously for the top and bottom values." />
<style type="text/css">
div
{
border: 30px double red;
border-image-slice: 100%;
border-image-source: url("support/green_color.png");
height: 100px;
margin: 50px;
width: 100px;
}
</style>
</head>
<body>
<p>Test passes if there are four identical green squares and no red visible on the page.</p>
<div></div>
</body>
</html>