- From: Lea Verou <leaverou@gmail.com>
- Date: Tue, 22 Nov 2011 18:09:13 -0800
- To: Brian Manthos <brianman@microsoft.com>
- CC: www-style list <www-style@w3.org>
Thank you! Updated.
On 22/11/11 18:06, Brian Manthos wrote:
> Attached is a prettier rendering for the second case in Example 4, in case you'd like to crop it for your draft.
>
> -Brian
>
>
> <!DOCTYPE html>
> <html>
> <head>
> <meta http-equiv="X-UA-Compatible" content="IE=10"/>
> <style>
> div
> {
> display: inline-block;
> height: 100px;
> width: 200px;
> background-image: -ms-linear-gradient(180deg, #f06, #f06 50%, transparent 50%),
> -ms-linear-gradient(162deg, black, black 50%, transparent 50%),
> -ms-linear-gradient(144deg, #f06, #f06 50%, transparent 50%),
> -ms-linear-gradient(126deg, black, black 50%, transparent 50%),
> -ms-linear-gradient(108deg, #f06, #f06 50%, transparent 50%),
> -ms-linear-gradient( 90deg, black, black 50%, transparent 50%),
> -ms-linear-gradient( 72deg, #f06, #f06 50%, transparent 50%),
> -ms-linear-gradient( 54deg, black, black 50%, transparent 50%),
> -ms-linear-gradient( 36deg, #f06, #f06 50%, transparent 50%),
> -ms-linear-gradient( 18deg, black, black 50%, #f06 50%);
> }
> div:nth-child(2)
> {
> -ms-transform: rotate(180deg);
> position: relative;
> left: -100px;
> width: 100px;
> background-size: 200px 100px;
> }
> </style>
> </head>
> <body>
> <div></div><div></div>
> </body>
> </html>
--
Lea Verou (http://lea.verou.me | @LeaVerou)
Received on Wednesday, 23 November 2011 02:09:43 UTC