I'm having trouble with my animation not working in Firefox and Safari, even though it works fine in Chrome. I've tried using the -Moz- and -WebKit- vendor prefixes, but it seems that Firefox and Safari already support the animation.
CSS:
.vision-div {
margin-top: 0rem;
width: 100%;
text-align: center;
}
.vision-grid-div {
width: 100%;
text-align: center;
margin-top: 5rem;
}
.visionheading {
font-size: 2.5rem;
text-align: center;
}
@property --num {
syntax: "<integer>";
initial-value: 0;
inherits: false;
}
.vision-subdiv1-span {
position: absolute;
left: 12.5rem;
}
<!-- Remaining CSS code retained for brevity -->
HTML:
<div className="vision-div container">
<h1 className="visionheading">
Why you should find a Fitness buddy!
</h1>
<!-- HTML markup continues below -->