Linear Gradient Test

HTML-CSS
#1

Applied Visual Design: Create a Gradual CSS Linear Gradient

I can’t see why I am not passing this test with my code for the linear-gradient.

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

</style>

<div></div>
#2

You have a linebreak and a random . in your background style.

1 Like
#3

Darn! Yes I do now see the . at the end of #FFCCCC - not entirely sure as to what the linebreak means though -
Let me hazard a guess -
There is a difference between
background: linear-gradient(35deg,#CCFFFF,#FFCCCC);
and
background: linear-gradient
(35deg,#CCFFFF,#FFCCCC);
That’s a question I would appreciate an answer to.

Thanks

#4

Yes. You don’t need to wait for an answer though. You can just try it and see that it works.

1 Like
#5

I would never have guessed. What if your window is constrained by a lack of horizontal width and your line of code just can’t be accommodated in a single straight line but is automatically knocked down one line? That is enough to invalidate the code?

#6

Text wrapping is not the same thing as putting text on two different lines by hitting “enter”. Computers are not reading a screen, they are reading characters. There are characters to tell computers that a line of text has ended.

1 Like
#7

Good - thank you - I do see the distinction.