how to rotate the Control at Mouse hover

how to rotate the Control at Mouse hover

  First make Div with followinf property


 .rightdiv
        {
            margin: 5px 0 10px 5px;
            border: 1px solid Black;
            border-radius: 3px;
            -moz-border-radius: 3px;
            -webkit-border-radius: 3px;
            -moz-transition: width 2s, height 2s, background-color 2s, -moz-transform 2s;
            -webkit-transition: width 2s, height 2s, background-color 2s, -webkit-transform 2s;
            -o-transition: width 2s, height 2s, background-color 2s, -o-transform 2s;
            transition: width 2s, height 2s, background-color 2s, transform 2s;
        }

Code at Mouse Hover

 .rightdiv:hover

        {

            background-color: Black;

            color: White;

            -moz-transform: rotate(360deg);

            -webkit-transform: rotate(360deg);

            -o-transform: rotate(360deg);

            transform: rotate(360deg);

        }