Gradual CSS Linear Gradient

WHATS THE ERROR IN THIS background: linear-gradient(35deg, #CCFFFF, #FFCCCC, rgb(204, 204, 255));
WHY IT IS NOT ACCEPTING IN CHALLENGE???

Your code so far


<style>

  div{ 
    border-radius: 20px;
    width: 70%;
    height: 400px;
    margin: 50px auto;
    background: linear-gradient(35deg, #CCFFFF, #FFCCCC, rgb(204, 204, 255));
  }

</style>

<div></div>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.62 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/

2 Likes

As per the instructions, you have three colours specified but only need two.

1 Like

background: linear-gradiente(35deg, #ccffff, #ffcccc);

using above code gives error : The div element should have a linear-gradient background with the specified direction and colors.

2 Likes

background: linear-gradient(35deg, #ccffff, #ffcccc);
this solves problem

2 Likes

Turns out the lowercase hex code is accepted by the site and uppercase is rejected although the effect is visible in either case. So, to complete the challenge, use lowercase hex code for colors.

1 Like

It is not actually, i also got stuck for a little bit here thats how i ended up here.
That completes the challenge. background: linear-gradient(35deg, #CCFFFF, #FFCCCC);
I got stuck because i had an extra space there and did not notice.
background: linear-gradient(35deg, #CCFFFF, #FFCCCC );

1 Like

Nice on there @ akay, i think, the essence of this is to get us conversant with CSS syntax

One little hint: the example renders correctly but is rejected when you are missing the final semicolon.

4 Likes

Thanks bro, this one was the solution after all, haha.

yeah, use semicolon after linear-gradient();

Why is the tag just background, as opposed to background-color?

The Solution is,
background: linear-gradient(35deg, #CCFFFF, #FFCCCC);