html - CSS Responsive Triangle Width -


simple question really, want know how make triangles width (made in css below code) equal page width when browser resizes triangle.

my code, far

.triangle {     color: crimson;     width: 0;     height: 0;     margin-top: 30%;     border-top: 100px solid crimson;     border-left: 100px solid transparent;     border-right: 100px solid transparent; } 

.triangle {     color: crimson;     width: 0;     height: 0;     margin-top: 30%;     border-top: 100px solid crimson;     border-left: 50vw solid transparent; /* check border size here! */     border-right: 50vw solid transparent; /* , here! */ } 

sample fiddle.

read more on css3 vh/vw units.

browser support not issue.


Comments

Popular posts from this blog

powershell Start-Process exit code -1073741502 when used with Credential from a windows service environment -

twig - Using Twigbridge in a Laravel 5.1 Package -

c# - LINQ join Entities from HashSet's, Join vs Dictionary vs HashSet performance -