Everything works, text is in the middle of an anchor. Whole ul tag is in the middle of the page, but this is only problem. When text is little bit longer it breaks and my anchor tag goes up, I'm not sure what is the problem. check it live and mojgolub(.)com
HTML\[code\]<div id="speeddial-wrapper"> <nav> <ul> <li> <a href="http://stackoverflow.com/questions/15463247/#" class="speeddial" id="s1">POPIS GOLUBOVA</a> </li> <li> <a href="http://stackoverflow.com/questions/15463247/#" class="speeddial" id="s2">POPIS GOLUBOVA MALO VECI TEKST NEGO UOBICAJENO</a></li> <li> <a href="http://stackoverflow.com/questions/15463247/#" class="speeddial" id="s3">POPIS GOLUBOVA></a></li> <li> <a href="http://stackoverflow.com/questions/15463247/#" class="speeddial" id="s4">POPIS GOLUBOVA</a> </li> <div style="clear:both; margin-top:25px;"></div> <li> <a href="http://stackoverflow.com/questions/15463247/#" class="speeddial" id="s1">POPIS GOLUBOVA</a> </li> <li> <a href="http://stackoverflow.com/questions/15463247/#" class="speeddial" id="s2">POPIS GOLUBOVA MALO VECI TEKST NEGO UOBICAJENO</a></li> <li> <a href="http://stackoverflow.com/questions/15463247/#" class="speeddial" id="s3">POPIS GOLUBOVA></a></li> <li> <a href="http://stackoverflow.com/questions/15463247/#" class="speeddial" id="s4">POPIS GOLUBOVA</a> </li> </ul> </nav></div>\[/code\]CSS\[code\]#speeddial-wrapper{ width:90%; margin:0 auto; margin-top:30px; text-align:center;}#speeddial-wrapper nav ul{ list-style-type:none; margin:0; padding:0;}#speeddial-wrapper nav ul li{ display:inline-table;}.speeddial{ font-family:speeddialfont; color:#FFFFFF; text-align:center; text-decoration:none; height:200px; width:200px; border:7px solid #AEAEAE; background-color:#49A655; border-radius:5px; display:table-cell; vertical-align:middle; margin-right:30px; margin-bottom:30px;}\[/code\]