Help of rotating background image

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?

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


    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); } }

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

CSS: rotate background images | the web thought

Googl has a lot of topics about it

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

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.