Skip to content

Instantly share code, notes, and snippets.

@adriano66
Last active August 29, 2015 14:20
Show Gist options
  • Select an option

  • Save adriano66/302004d6677e5e431236 to your computer and use it in GitHub Desktop.

Select an option

Save adriano66/302004d6677e5e431236 to your computer and use it in GitHub Desktop.
Heading strike through
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<style>
h1 {
text-align: center;
overflow: hidden;
}
h1 > span {
position: relative;
padding: 0 1em;
}
h1 > span::after, h1 > span::before {
position: absolute;
content: "";
width: 400%;
height: 2px;
background: red;
top: 0.5em;
}
h1 > span::after {
right: 100%;
}
h1 > span::before {
left: 100%;
}
</style>
</head>
<body>
<h1><span>Lorem ipsum dolor sit amet.</span></h1>
<h1><span>Laudantium eius soluta optio quisquam?</span></h1>
<h1><span>Cupiditate reprehenderit veniam quibusdam, nisi.</span></h1>
<h1><span>Doloremque sint quos culpa minus.</span></h1>
<h1><span>Odit facere optio est. Veniam.</span></h1>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment