Friday, September 9, 2011

HTML5 :: div :: rounded corners :: webkit

CSS with webkit
.round {
  -moz-border-radius:    10px;
  -webkit-border-radius: 10px;
}

CSS without webkit
.round {
  // All corners are round
  border-radius: 10px;
  // diagonally opposite corners are rounded;
  border-radius: 10px 3px;
  // custom round
  border-radius: 20px 3px 8px 14px;
}

HTML5 :: Work in IE8


HTML5 tags dont work on IE, to make it work include the lines below in the <head>

<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->;

HTML5 :: div :: shadow

Give Shadow to a div in HTML5

HTML5
<div class="shadow">
Something
</div>

CSS
.shadow {
-moz-box-shadow: 0 0 30px 5px #999;
-webkit-box-shadow: 0 0 30px 5px #999;
}