| <html> | |
| <head> | |
| <style> | |
| #content { | |
| margin:100px; | |
| width:110px; | |
| height:110px; | |
| background:linear-gradient(skyblue,skyblue); | |
| transform:skew(135deg, 0deg); | |
| border:1px solid black; | |
| } | |
| #border { | |
| width:100px; | |
| height:100px; | |
| position:absolute; | |
| left: -5px; | |
| top: -5px; | |
| border:10px solid black; | |
| } | |
| </style> | |
| </head> | |
| In the example below you should see a skewed block filled with skyblue. | |
| <div id="content"> | |
| <div id="border"></div> | |
| </div> | |
| </html> |