семантический интерфейс кнопки не отображается правильно

я создаю кнопку с помощью семантической основы пользовательского интерфейса CSS это мой код: должен бытьсемантический интерфейс кнопки не отображается правильно

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title></title> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
<link rel="stylesheet" href="dist/semantic.min.css" /> 
<script type="text/javascript" src="dist/semantic.min.js"></script> 

<link rel="stylesheet" href="dist/components/button.min.css" /> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div class="ui labeled button" tabindex="0"> 
<div class="ui button"> 
<i class="heart icon"></i> Like 
</div> 
<a class="ui basic label"> 
2,048 
</a> 
</div> 

</form> 

</body> 
</html>

результат этого: