Help of rotating background image

[haya]

This is a react problem its not from the free code camp.
All i want to do is i want to put an image and set a background image to it them make the background image to rotate but i cant do it could u plz tell me what should i do?

html
            <div className="circle">
            <div className="rotate">
            </div>
        <img src={orange} alt="BigCo Inc. logo"/>
        </div>

css

.circle{
    background-image: url(../src/imgs/circle\ shape.png);
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
}

.circle {
    -webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:spin 4s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

[Jaydog]

Have you tried transform:rotate(20deg); ?

[zaklina]

CSS: rotate background images | the web thought

Googl has a lot of topics about it

[lasjorg]

The animation is working, I’m guessing you just can’t see the image. Try giving the .circle div a height.

Also, the path you have to the image doesn’t look right, if that really is how you have it.

../src/imgs/circle\ shape.png