JSFiddle - React, Tailwind, and code Playground

by mdss

HTML

<div class="test-box">
	<ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
		<li>4</li>
		<li>5</li>
	</ul>
</div>

CSS

body { min-width: 600px; margin: 0 10px; font: 0.8125em/1 Verdana,sans-serif; background: #fff; }
.test-box {
	background: #F8F7EF; 
	border: 1px dashed #000;
	border-bottom: 1px dashed #000;
	margin: 10px auto 10px;
	padding: 10px 0;
}
	.test-box ul {		
		margin: 0;
		padding: 0;
		list-style: none;
	}
/* CSS для примера */
ul {
	font: 14px Verdana, Geneva, sans-serif;
	text-align: justify;
	/* Обнуляем для родителя*/
	line-height: 0;
	font-size: 1px; /* 1px для Opera */
	/* Лекарство для IE6-7*/		
	text-justify: newspaper;
	zoom:1;
	/* Включаем в работу последнюю строку*/		
	text-align-last: justify;	
}
	ul:after {
		width: 100%; 
		height: 0px;
		visibility: hidden;
		overflow: hidden;
		content: '';
		display: inline-block;
	}
	ul li  {
		background: #E76D13;
		width: 98px;
		height: 98px;
		display: inline-block;
		text-align: left;
		border: 1px solid #000;
		/* Востанавливаем у потомков, кроме последнего*/
		line-height: normal;
		font-size: 14px;
		/* Без него в Opera будет отступ под элементами */
		vertical-align: top; 
		/* эмуляция inline-block для IE6-7*/
		//display : inline;
		//zoom : 1;
	}