
Untitled
By: a guest on
Dec 5th, 2011 | syntax:
None | size: 1.43 KB | hits: 73 | expires: Never
/****** HTML ******/
<!doctype html>
<head>
<title>css3pie Test</title>
<link rel="stylesheet" type="text/css" href="css/css3pietest.css">
<!--
<link rel="stylesheet/less" type="text/css" href="css/css3pietest.less">
<script src="js/less.js" type="text/javascript"></script>
-->
</head>
<body>
<div id="box1">
<p>this is box one</p>
</div>
<br />
<div id="box2" class="insetShadow">
<p>this is box two</p>
</div>
<br />
<!--[if gte vml 1]>Yay, VML!<![endif]-->
<![if !vml]>Boo, no VML!<![endif]>
<!--[if lt IE 10]>
<script type="text/javascript" src="path/to/PIE.js"></script>
<![endif]-->
</body>
</html>
/***** LESSCSS FILE *****/
#box1 {
border: 1px solid #696;
padding: 60px 0;
text-align: center;
width: 200px;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
-webkit-box-shadow: #666 0px 2px 3px;
-moz-box-shadow: #666 0px 2px 3px;
box-shadow: #666 0px 2px 3px;
background: #EEFF99;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#EEFF99), to(#66EE33));
background: -webkit-linear-gradient(#EEFF99, #66EE33);
background: -moz-linear-gradient(#EEFF99, #66EE33);
background: -ms-linear-gradient(#EEFF99, #66EE33);
background: -o-linear-gradient(#EEFF99, #66EE33);
background: linear-gradient(#EEFF99, #66EE33);
-pie-background: linear-gradient(#EEFF99, #66EE33);
behavior: url(PIE/PIE.php);
}
#box2 {
width: 200px;
height: 200px;
background-color: yellow;
}