By using Elementorforum.com’s services you agree to our Cookies Use and Data Transfer outside the EU.
We and our partners operate globally and use cookies, including for analytics, personalisation, ads and Newsletters.

  • Join the Best Unofficial Elementor Support forum

    Provide or get advice on everything Elementor and Wordpress, ask questions, gain confirmation or just become apart of a friendly, like minded community who love Wordpress and Elementor


    Join us!
elementor official

Custom CSS Background

T

tah

New Member
Trying to make a section use custom CSS Animation. Any help will be appreciated!

When I highlight the section and paste the code into the CSS field the entire page takes on the animation.

Here's the code:

body {
margin: 0;
width: 100%;
height: 100vh;
font-family: "Exo", sans-serif;
color: #fff;
background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
background-size: 400% 400%;
animation: gradientBG 15s ease infinite;
}

@keyframes gradientBG {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}

.container {
width: 100%;
position: absolute;
top: 35%;
text-align: center;
}

h1 {
font-weight: 300;
}

h3 {
color: #eee;
font-weight: 100;
}

h5 {
color:#eee;
font-weight:300;
}

a,
a:hover {
text-decoration: none;
color: #ddd;
}
 
elementor official

Latest posts

Other Elementor Resources

elementor official
elementor official
Top