-5

I have a problem with CSS when building my website, I have submit a ticket to plugin developer but he didn't answer my ticket.

I've used CSS key frame to display text effect for my home page at https://www.canthoweb.com/. As you can see the slider has text effect.

The CSS key frame code below:

  @keyframes color-text {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 1000px 0;
  }
}
.canthoweb {
   background: linear-gradient(to right, #048A81 0%, #048A81 15%, #048A81 35%, #048A81 50%, #048A81 85%, #ffdd00 90%, #048A81 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        -webkit-animation: color-text 5s infinite;
    }

But the problem this key frame affected the modal popup even I did not use the CSS class .canthoweb in the modal popup.

You can view modal popup by click the three box below the slider. The modal popup will display and all text content has css key frame effect.

Why the css key frame applied for the modal popup ? I did not enter the key frame class there?

halfer
  • 19,824
  • 17
  • 99
  • 186
newbieonline
  • 1
  • 2

1 Answers1

0

Check that the Modal element does not have the same CSS id or Class.

deviantxdes
  • 469
  • 5
  • 17