2011-01-30 Simon Fraser <simon.fraser@apple.com>
[WebKit-https.git] / LayoutTests / fast / box-shadow / inset-box-shadow-radius.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4   <style type="text/css" media="screen">
5     .wrapper {
6       outline: 1px solid black;
7       width: 280px;
8       height: 280px;
9       -webkit-box-sizing: border-box;
10       margin: 4px;
11       display: inline-block;
12     }
13     
14     .box {
15       position: relative;
16       width: 280px;
17       height: 280px;
18       display: inline-block;
19     }
20         
21     .indicator {
22       position: absolute;
23       width: 280px;
24       height: 280px;
25       -webkit-box-sizing: border-box;
26       border: 0 solid rgba(0, 255, 0, 0.05);
27     }
28     
29   </style>
30 </head>
31 <body>
32   
33   <!-- The extent of the shadow should approximately match the pale green boxes. -->
34   <div class="wrapper">
35     <div class="indicator box" style="border-width: 10px"></div>
36     <div class="box" style="box-shadow: 0 0 10px black inset"></div>
37   </div>
38
39   <div class="wrapper">
40     <div class="indicator box" style="border-width: 20px"></div>
41     <div class="box" style="box-shadow: 0 0 20px black inset"></div>
42   </div>
43   <br>
44
45   <div class="wrapper">
46     <div class="indicator box" style="border-width: 50px"></div>
47     <div class="box" style="box-shadow: 0 0 50px black inset"></div>
48   </div>
49
50   <div class="wrapper">
51     <div class="indicator box" style="border-width: 90px"></div>
52     <div class="box" style="box-shadow: 0 0 90px black inset"></div>
53   </div>
54
55 </body>
56 </html>