samedi 21 novembre 2020

Why does gradient turns upside down when 0deg is applied?

I am learning CSS Gradients, I observed something and I am not able to understand it. For a class ~ 'box', I applied the following CSS

.box{
  width: 50vw;
  height: 70vh;
  background-image:
    linear-gradient(red, blue);
}
<div class="box"></div>

And I got the expected result, however, I then added a - 0deg property (as seen in the code below) the gradient just flipped vertically. Why did it happen? Shouldn't there be no changes as I wrote 0deg

.box{
  width: 50vw;
  height: 70vh;
  background-image:
    linear-gradient(0deg, red, blue);
}
<div class="box"></div>

Aucun commentaire:

Enregistrer un commentaire