Furkan's Notes

Furkan's Notes

How to Rotate Background Image

How to Rotate Background Image

Listen to this article

It is as simple as adding a before or after element inside a container

.container {
  position: relative;
  overflow: hidden;
}

.container::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 10;
  background: url(background.jpg) 0 0 repeat;
  transform: rotate(30deg);
}
 
Share this