CODEWITHSUNDEEP
javascripthtmlcsslinear-gradients
Aqua the SeaWing
Aqua the SeaWing

Reputation: 333

CSS linear gradient facing left (right to left)

This should be obvious, but for whatever reason I can't figure out how to make a linear-gradient that faces left (using JavaScript).

var element = document.getElementById("log-list-id-1"); // Works, it's in another function, but definitely works.
element.style.background = "linear-gradient(right, #0000FF, #0000FF 20px, #EEEEEE 21px)";

I know that it works for other gradients:

element.style.background = "linear-gradient(#0000FF, #0000FF 20px, #EEEEEE 21px)";

But it doesn't work for making it face background.

Note: I use FirefoxDevelopmentVersion 36.

Upvotes: 0

Views: 1170

Answers (1)

Weafs.py
Weafs.py

Reputation: 22992

Use to left.

div {
  width: 300px;
  height: 100px;
  background: linear-gradient(to left, #0000FF, #0000FF 20px, #EEEEEE 21px);
}
<div></div>

Using JavaScript.

var elem = document.getElementsByTagName('div')[0];

elem.style.width = '300px';
elem.style.height = '100px';
elem.style.background = 'linear-gradient(to left, #0000FF, #0000FF 20px, #EEEEEE 21px)';
<div></div>

Upvotes: 2

Related Questions