Thursday, June 18, 2015

div rotate using CSS3 transform Property

<!DOCTYPE html>
<html>
<head>
<style>
div {
    width: 200px;
    height: 100px;
    background-color: yellow;
    /* Rotate div */
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    transform: rotate(75deg);
}
</style>
</head>
<body>

<div>Hello</div>
<br>

<p><b>Note:</b> Internet Explorer 8 and earlier versions do not support the transform property.</p>

<p><b>Note:</b> Internet Explorer 9 supports an alternative, the -ms-transform property. Newer versions of IE support the transform property (do not need the ms prefix).</p>

<p><b>Note:</b> Chrome, Safari and Opera supports an alternative, the -webkit-transform property.</p>

</body>
</html>

No comments: