Rotating a div in clockwise direction using CSS animation

Question

I am new to coding and trying to rotate a div element with id circle in the clockwise direction using CSS keyframe animation. Here is a sample of what I tried and it's not rotating

#circle{
    width:100px;
    height:100px;
    border-radius:50%;
    background-color: white;
    animation: turn 10s infinite;
}
@keyframes turn{
    0%{
        transform: rotate(90deg);
    }
    50%{
        transform: rotate(180deg);
    }
    100%{
        transform: rotate(360deg);
    }
}

Thanks.

Answer 1

Try the code below

#circle{
    width:100px;
    height:100px;
    border-radius:50%;
    background-color: white;
    animation: turn 10s infinite linear;
}
@keyframes turn{
    from{
        transform: rotate(0deg);
    }
    to{
        transform: rotate(360deg);
    }
}