IvanPeternel

text-align: justify; в inline-block сработает только при добавлении псевдоэлемента (after или before), потому как это свойство выравнивает содержимое по всей ширине кроме последнего элемента (его ровняет по левому краю).

То есть при 2-х строчках - первая растягивается на всю ширину, вторая по левому краю.

Псевдоэлемент заменяет как-бы вторую строчку.

<html>

<head>       

	<meta charset="utf-8">

	<style>



		ul {

			text-align: justify;

			background: #f2f2f2; 

		}



		ul::after {

			display: inline-block;

			width: 100%;

			content:'';

		}



		li {

			display: inline-block;

		}



	</style>

</head>

<body> 

	<ul>

		<li>Главная</li>

		<li>Новости</li>

		<li>Товар</li>

		<li>Контакты</li>

	</ul>

</body>

</html>

Боковыми паддингами или маржинами для li можете задать минимальное расстояние между ними.