Untitled

dabblet.css

body {
	margin: 100px 20px;
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	font-weight: 300;
}

li {
	margin-bottom: 10px;
}

.button {
	display: inline-block;
	background: hsl(40, 100%, 60%);
	color: hsl(40, 100%, 20%);
	text-decoration: none;
	padding: 5px 10px;
}

[data-notifications] {
	position: relative;
}

[data-notifications]:after {
	content: attr(data-notifications);
	position: absolute;
	background: red;
	border-radius: 50%;
	display: inline-block;
	padding: 0.3em;
	color: #f2f2f2;
	right: -15px;
	top: -15px;
}



	

dabblet.html

<ol>
  <li>
    <a data-notifications="10" class="button" href="#">New Comments on Your Posts</a>
  </li>
  <li>
    <a class="button" href="#">Number of Post Likes :)</a>
  </li>
<ol>

settings.json

{"view":"split-vertical","prefixfree":"1","page":"css"}