CSSPortal Playground Examples

<!DOCTYPE html>
<html>
  <head>
    <style type="text/css">
	.badge1 {
		position:relative;
	}
	.badge1[data-badge]:after {
		content:attr(data-badge);
		position:absolute;
		top:-10px;
		right:-10px;
		font-size:.7em;
		background:green;
		color:white;
		width:18px;height:18px;
		text-align:center;
		line-height:18px;
		border-radius:50%;
		box-shadow:0 0 1px #333;
	}
    </style>
  </head>
  <body>
    <h1>CSS Notification Badge Example</h1>
	<button class="badge1" data-badge="6">Badge Notification Example</button>
	<br><br><br>
	<a href="" class="badge1" data-badge="27">Badge Notification Example</a>
  </body>
</html>