Skip to content

Instantly share code, notes, and snippets.

@jpsirois

jpsirois/fiddle.css

Created August 22, 2012 12:16
Show Gist options
  • Save jpsirois/3425015 to your computer and use it in GitHub Desktop.
Save jpsirois/3425015 to your computer and use it in GitHub Desktop.
Download ZIP
CSS :before without getting the text-decoration
Raw
fiddle.css
body {
margin: 2em;
}
a {
display: inline-block;
margin-bottom: 1em;
position: relative;
border-bottom: 1px solid black;
text-decoration: none;
}
a:before {
content: "»";
color: black;
padding: 0 .25em;
}
a.no-before-border:before {
left: -1em;
position: absolute;
text-decoration: none;
padding-bottom: 10px;
background-color: white;
}
Raw
fiddle.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>CSS :before without getting the text-decoration</title>
</head>
<body>
<a href="http://google.com">:before got the border</a>
<br />
<a href="http://duckduckgo.com" class="no-before-border">:before did’nt get the border</a>
</body>
</html>
Raw
fiddle.manifest
name: CSS :before without getting the text-decoration
authors:
- Jean-Philippe Sirois
@jpsirois
Copy link
Author

Live example : http://3425015.run-a-gist.herokuapp.com/

@jpsirois
Copy link
Author

New (more friendly) working example: http://jsfiddle.net/gh/gist/zepto/0.8/3425015/

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