animation works in style.css, but will not work in other style sheet. why? - TechRepublic
Question
May 30, 2021 at 04:00 PM
spencer1621515293

animation works in style.css, but will not work in other style sheet. why?

by spencer1621515293 . Updated 5 years ago

Hi, my animations work in style.css, but It won’t work when put in another style sheet in a folder named css, and the file in that folder named slider.css
I have enqueued it and put the css in. but cannot figure out what I have done wrong..
I have enqeued it in functions php along with others.
here it is:

and here is the css in the slider.css file:
/*
Theme Name: twentythirteen child
Theme URI: https://www.wpbeginner.com/
Description: A Twenty Thirteen child theme
Author: WPBeginner
Author URI: https://www.wpbeginner.com
Template: twentythirteen
Version: 1.0.0
*/

@import url(“../twentythirteen/css/slider.css”);

.ball {
animation: .5s move infinite alternate linear;
}

.ball.bouncing {
animation: .5s bounce infinite cubic-bezier(.1,.25,.1,1) alternate;
}

/* define keyframes */

@keyframes move {
0% {
transform: translateY(200%);
}
100% {
transform: translateY(0);
}
}

body {
text-align: center;
background: #fafafa;
padding: 50px;
text-align: center;
}

.ball {
width: 10%;
padding-bottom: 10%;
border-radius: 50%;
background: #2098d1;
box-shadow: 0px 5px 0px rgba(0,0,0,0.2);
margin-left: 10%;
display: inline-block;
}

If anyone can help me solve this please

All Comments