Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
Sign in to follow this  

Need this CSS script to be mobile responsive please


Posted (edited)

Hi I have a CSS script that rotates 6 different words into a code block. The issue is it isn't mobile responsive. I have a strong feeling it is difficult because one of the words that rotates in is too long. So as a suggestion, could someone provide a tweak to this so that it displays in a fixed size in mobile. I can just tweak the size until I can get all the words in. I believe I just need to update my code block info:


Here is the code block


  <div class="rotating-words rotating-words-1">




// Rotating Word 1 //

.rotating-words-1 span:nth-child(2) {
    -webkit-animation-delay: 3s;
    -moz-animation-delay: 3s;
    -o-animation-delay: 3s;
    -ms-animation-delay: 3s;
    animation-delay: 3s;
    color: #EA1D26;

// Rotating Word 2 //

.rotating-words-1 span:nth-child(3) {
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
    color: #EA1D26;

// Rotating Word 3 //

.rotating-words-1 span:nth-child(4) {
    -webkit-animation-delay: 9s;
    -moz-animation-delay: 9s;
    -o-animation-delay: 9s;
    -ms-animation-delay: 9s;
    animation-delay: 9s;
    color: #EA1D26;

// Rotating Word 4 //

.rotating-words-1 span:nth-child(5) {
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
    color: #EA1D26;

// Rotating Word 5 //

.rotating-words-1 span:nth-child(6) {
    -webkit-animation-delay: 15s;
    -moz-animation-delay: 15s;
    -o-animation-delay: 15s;
    -ms-animation-delay: 15s;
    animation-delay: 15s;
    color: #EA1D26;

Edited by Lystnr

Share this post

Link to post

0 answers to this question

Recommended Posts

There have been no answers to this question yet

Create an account or sign in to comment

You need to be a member in order to leave a comment

Sign in to follow this  

  • Create New...