Someone help me out kindly, where am I missing out?

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

  **Your code so far**


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

</style>

<div></div>

  **Your browser information:**

User Agent is: Mozilla/5.0 (Linux; Android 10; Nokia 2.1 Build/QKQ1.190828.002) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Mobile Safari/537.36

Challenge: Create a Gradual CSS Linear Gradient

Link to the challenge:

2

You seem to have put an extra space after linear- in linear-gradient.
Removing the extra space should work.

1 Like
3

There’s extra spaces in every line.
Spaces in CSS are not always necessary. Spaces are used to make things look nicer and more organized. We can write CSS without any spaces at all, except when we’re giving multiple values to the same property.

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

The space between 50px and auto does need to be there. Just one space. When we use multiple values in margin, position, or other properties that accept multple values.

You can learn all these things by looking up gradient reference guides on w3 shools, MDN, or the reference site of your choice. Here are two popular reference sites you can find all you want to know about CSS as well as other languages.

4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.