JSFiddle - React, Tailwind, and code Playground

by totszwai

HTML

<ul>
		<li><a href="#" title="grid-columns">grid-columns</a></li>
		<li><a href="#">grid-rows</a></li>
		<li><a href="#" title="hanging-punctuation">hanging-punctuation</a></li>
		<li><a href="#" title="height">height</a></li>
		<li><a href="#" title="icon">icon</a></li>
		<li><a href="#" title="left">left</a></li>
		<li><a href="#" title="letter-spacing">letter-spacing</a></li>
		<li><a href="#" title="line-height">line-height</a></li>
	</ul>

CSS

ul {
			font:normal 16px Arial;
		}
		li, a {
			display:inline-block;
			text-align:center;
		}
		a {
			padding:4px 8px;
			text-decoration:none;
			color:#333;
		}
		a:hover {
			font-weight:bold;
			background:#eee;
		}
		a::before {
			display: block;
			content: attr(title);
			font-weight: bold;
			height: 0;
			overflow: hidden;
			visibility: hidden;
		}