perjantai 4. maaliskuuta 2016

How to create fancy looking triangles with CSS

I wanted to learn how to create those fancy looking triangles with css so here is my result.

<!DOCTYPE html>
<head>
<style>
body {
   padding: 0;
   margin: 0;
}
.arrow-up {
    margin-top:10px;
    background: transparent;
    height: 0;
    border-left: 100vw solid transparent;
    border-bottom: 100px solid #ff0;
}
.tausta {
    background:#ff0;
    height:200px;
    padding:20px;
}
</style>
</head>
<body>
<div class="arrow-up"></div>
<div class="tausta">Sample text</div>
</body>
</html>



Ei kommentteja:

Lähetä kommentti