Mateusz Dobrakowski
Mateusz Dobrakowski

Reputation: 3

triangle background with css

I want to create a div with background like this:

enter image description here

But I also want to scale it with width 100% and height about 500px. I used some gradient generators but I have to specify degree and I cant scale it. Can I make this using only css?

I want get the line in this background exactly from one corner to another.

Is the only option scale height too? with for example 50% and specify exact degree value in gradient attribute?

Upvotes: 0

Views: 646

Answers (1)

Paulie_D
Paulie_D

Reputation: 114990

A linear gradient can be defined without angles and use positions instead

JSfiddle Demo

Gradient defaults from top left

linear-gradient(to bottom right, red, red 50%, blue 50% , blue);

Upvotes: 4

Related Questions