Объясните смысл задавать блочный элемент ul?

КУРС HTML/CSS 34 задание

Есть html код:

<div class="menubar">
				
   <ul class="menu">
	   <li class="selected"><a href="#">Главная</a></li>
	   <li><a href="#">Фильмы</a></li>
	   <li><a href="#">Сериалы</a></li>
	   <li><a href="#">Рейтинг фильмов</a></li>
	   <li><a href="#">Контакты</a></li>
  </ul>

</div>

и CSS:

ul.menu li a {
	font: normal 100% 'trebuchet ms', sans-serif;
	display: block;
	height: 20px;
	padding: 6px 35px 5px 28px;
	color: #fff;
	text-decoration: none;
}

В Видео говориться просто, что display: block меняет "не блочный элемент в блочный. Здесь все просто". Просто-то-просто, но во-первых какой именно элемент становится блочным ul или li, во-вторых почему-то не говорится, что элемент вообще был блочным или не блочным, а самое главное - ЗАЧЕМ менять элемент из блочного в не блочный? Убирая этот код, ничего не меняется, смысл я не понимаю, объясните пожалуйста.