Skip to content

Instantly share code, notes, and snippets.

@kyleondata
Created December 17, 2012 22:28
Show Gist options
  • Save kyleondata/4322964 to your computer and use it in GitHub Desktop.
Save kyleondata/4322964 to your computer and use it in GitHub Desktop.
CSS Triangles
<html>
<head>
<style>
body{
background-color: #eee;
}
.triForce {
height: 50px;
width: 50px;
}
.topTri {
border-color: transparent transparent gold;
border-style: solid;
border-width: 40px;
left: 68px;
position: fixed;
top: 0;
}
.leftTri {
border-color: transparent transparent gold;
border-style: solid;
border-width: 40px;
left: 28px;
position: fixed;
top: 40px;
}
.rightTri {
border-color: transparent transparent gold;
border-style: solid;
border-width: 40px;
left: 108px;
position: fixed;
top: 40px;
}
h2{
margin-left:15px;
}
</style>
</head>
<body>
<h2>Triforce CSS Love</h2>
<div class='triforce'>
<div class='topTri'></div>
<div class='leftTri'></div>
<div class='rightTri'></div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment