Как отцентрировать картинки?

Question

[AlexMark]

как сделать, чтобы картинки были по центру над буквами. если кидать маргином/паддингом, то картинки центрируются по центру блока, но буквы ведь остаются на месте, и каждая по разному стоит тогда.

<nav class="menu top_menu">
								<ul>
									
									<li><a href=""><img src="img/catalog.png" alt="">Онлайн каталоги</a></li>
									<li><a href=""><img src="img/food.png" alt="">Рецепты</a></li>
									</li>
								</ul>
							</nav>

nav ul{
	list-style: none;
	padding: 0;
	margin: 0;
}

nav ul>li{
	display: inline-block;
	text-align: center;
}

.menu ul>li{
	padding-right: 37px;
}


.menu img{
	display: block;
}

Answer 1

[WQP]

.menu img{
  display: block;
  max-width: 100%;
  margin: 0px auto;
}

Answer 2

[Ankhena]

Очень интересно, при Вашей записи

nav ul>li{
  display: inline-block;
  text-align: center;
}

Картинки и так должны быть по центру.

И если они так не становятся, надо смотреть остальной код, нет ли там какого-нибудь лишнего, например, float:left, для всех картинок.

Это https://jsfiddle.net/cqnxg7ej/ Ваш код и он работает. (Ну только там был один лишний закрывающий li, его убрала)