background-clip_padding-box

background-clip_border-box

WeasyPrint

Reference (good) by WeasyPrint

Reference (good) by this browser

This browser

Assertion
Test passes if border is blue and dotted without red background

Source

 1 <!DOCTYPE html>
 2 <html><head>
 3     <title>CSS Backgrounds and Borders Test: background-clip_border-box</title>
 4     <link href="mailto:dajiangxiaoyan@126.com" rel="author" title="Xiaoyan Jiang">
 5     <link href="mailto:jinlongz@oupeng.com" rel="reviewer" title="Jinlong Zhang">
 6     <link href="http://www.w3.org/TR/css3-background/#the-background-clip" rel="help">
 7     <link href="reference/background_clip_padding-box.htm" rel="match">
 8     <meta content="Test passes if border is blue and dotted without red background" name="assert">
 9     <style type="text/css">
10         /* Positioned container allows for the self-describing statement to still
11            be visible in the case of failure */
12         .container {
13             position: absolute;
14         }
15         .test {
16 			background-color: red;
17 			height: 130px;
18 			left: 5px;
19 			top: 5px;
20 			width: 130px;
21 			border: blue dotted 5px ;
22 			position: absolute;
23 			background-clip: padding-box;
24          }
25 
26 
27     </style>
28 </head>
29 <body>
30 <p>Test passes if border is blue and dotted without red background </p>
31     <div class="container">
32         <div class="test"></div>
33     </div>
34 
35 
36 </body></html>