CSS Transforms

Change class name on click in jQuery

by Anton

HTML

<div id="container" class="rotate">
  <p>Hello World</p>
</div>

CSS

#container {
  margin: 100px;
  width: 120px;
  padding: 20px;
  text-align: center;
  background-color: black;
  color: white;
  font-weight: bold;
}

.skew {
  transform: skew(-10deg, -10deg);
}

.rotate {
  transform: rotate(45deg);
}