Skip to content

Instantly share code, notes, and snippets.

@jcable
Created February 6, 2020 22:49
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jcable/659ae0de0515513a5863fc8b19dea85e to your computer and use it in GitHub Desktop.
Save jcable/659ae0de0515513a5863fc8b19dea85e to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<style>
div.b {
clip-path: inset(50px 20px 300px 30px);
}
div.a {
font-family: Sans-Serif;
font-weight: bold;
text-align: center;
padding-left: 5px;
padding-top: 5px;
width: 120px;
height: 25px;
color: white;
background-color: red;
-ms-transform: rotate(45deg); /* IE 9 */
transform: rotate(45deg);
}
</style>
</head>
<body>
<br>
<br>
<div class="b">
<div class="a">For Sale</div>
</div>
<br>
</body>
</html>
@jcable
Copy link
Author

jcable commented Feb 6, 2020

example of CSS 45 degree clipped text

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment