CSS - Responsive triangle divider

65 views Asked by At

I am trying to create a triangle css divider. I was able to create the divider using

border-width: 4vw 75vw 0 23vw.

however, this way feels a bit sketchy. border-with you can't pass percentages, is this solution valid?

This is my css class:

.triangle {  
width: 100%;   
box-sizing: border-box;   
height: 0;   
border-style: solid;   
border-width: 4vw 75vw 0 23vw; }

It seems to me that 75vw is not a correct solution.

This is the divider: css divider

1

There are 1 answers

0
Arleigh Hix On

If you are asking if the CSS is valid syntax, the answer according to CSS Lint is yes.
Your CSS only produces 1 warning about "The box-sizing property isn't supported in IE6 and IE7."