<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="row"> <div class="col-xs-1"> <nav class="navbar" > <div class="sol-bilgiler"> <div class="navbar-header"> <ul class=" nav navbar-btn"> <li><a class="solbilgi-font" href=""> <img class="img-circle" src="" width="85" height="70" />   Çorbalar</a></li> <li><a class="solbilgi-font" href=""> <img class="img-circle" src="" width="85" height="70"/>      Sulu   Yemeksel</a></li> <li><a class="solbilgi-font" href=""> <img class="img-circle" src="" width="85" height="70"/> Makarnalar</a></li> <li><a class="solbilgi-font" href=""> <img class="img-circle" src="" width="85" height="70"/>  Hamursal<br>     İşler</a></li> <li><a class="solbilgi-font" href=""> <img class="img-circle" src="" width="85" height="70"/> Kahvelerimiz</a> </li> <li> <a class="solbilgi-font" href=""> <img class="img-circle" src="" width="85" height="70"/>    Çocuklar        İçin<br>  Yemekler</a></li> </ul> </div> </div> </nav> </div>

.navbar-btn{margin-top:0px;margin-bottom:0px;} .navbar-btn>li>a:hover{color:#D7D7D7; background-color:#16a085; } .sol-bilgiler{ background-color:#1abc9c; margin-top:12px; width:126px; height:1480px; margin-bottom:-19px; margin-left:-15px; box-shadow:2px 1px 8px 1px black;} .sol-bilgiler a{ text-decoration:none; color:#000000;} .sol-bilgiler a:hover{ color:#3498db;} .solbilgi-font{font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif; font-size:16px; font-weight:700;}