Проблема с меню картинками - Вопросы по CSS

ul.menukrugl li {
	display: inline-block;
	border: none;
	height: 200px;
	width: 240px;
	line-height: 360px;
	margin: 0 2px 0;
	padding: 0;
	background: url('../images/style3/tabs_small_icons.png') no-repeat 0 0;
	overflow: hidden;
	text-align: center;
	font-size: 27px;
	color: #FFF;
}
ul.menukrugl li.item-111 {
	background-position: 45px 0;
}
ul.menukrugl li.item-111:hover,ul.menukrugl li.item-111.active {
	background-position: 45px -200px;
}
ul.menukrugl li.item-112 {
	background-position: -155px 0;
}
ul.menukrugl li.item-112:hover,ul.menukrugl li.item-112.active {
	background-position: -155px -200px;
}

<section id="gkHeader">
<ul class="menukrugl">
<li class="item-111 current active"><a href="/" >п1</a></li>
<li class="item-112"><a href="/index.php/search" >п2</a></li>
<li class="item-113"><a href="/index.php/list" >п3</a></li>
<li class="item-114"><a href="/index.php/programs" >п4</a></li>
</ul>
</section>

ul.menukrugl li a{
	display: inline-block;
	border: none;
	height: 200px;
	width: 240px;
	line-height: 360px;
	margin: 0 2px 0;
	padding: 0;
	background: url('../images/style3/tabs_small_icons.png') no-repeat 0 0;
	overflow: hidden;
	text-align: center;
	font-size: 27px;
	color: #FFF;
}

<section id="gkHeader">
<ul class="menukrugl">
<li class="item-111 current active"><a href="/" >п1</a></li>
<li class="item-112"><a href="/index.php/search" >п2</a></li>
<li class="item-113"><a href="/index.php/list" >п3</a></li>
<li class="item-114"><a href="/index.php/programs" >п4</a></li></ul>
</section>