內聯樣式無法使用側邊菜單

我不太清楚爲什麼我不能讓這個菜單變成水平而不是垂直。我跟着很多社區帖子，使用浮動和內聯塊等組合，似乎我可能會錯過一些東西。內聯樣式無法使用側邊菜單

這是代碼;

<div class="sidebar-left"> 
     <div class="sidebar-links"> 
     <a href="#"><i class="fa fa-tachometer"></i>1</a> 
     <a href="#"><i class="fa fa-tachometer"></i>2</a> 
     <a href="#"><i class="fa fa-tachometer"></i>3</a> 
     <a href="#"><i class="fa fa-tachometer"></i>4</a> 
     </div> 
    </div>

.sidebar-left { 
    width: 15vw; 
    height: 0; 
    position: fixed; 
    background-color: black; 
} 

.sidebar-left .sidebar-links { 
    margin: 20px auto; 
} 

.sidebar-links div { 
    display: inline-block; 
} 

.sidebar-left .sidebar-links > a { 
    display: block; 
    text-decoration: none; 
    padding: 20px 0; 
    background-color: black; 
    text-align: center; 
    color: #b3bcc5; 
    font-size: 0.75rem; 
    font-weight: bold; 
} 

.sidebar-links a i.fa { 
    display: block; 
    font-size: 35px; 
    margin-bottom: 5px; 
}

http://plnkr.co/edit/g8G4bE3MwWl68aHglF6U?p=preview

這一直是東西，我最初以爲會是簡單的事情很沮喪，已經被證明是有點棘手。

我希望有人能指出我出錯的地方！

感謝

（只是爲了確認：其目的是使菜單的水平，而不是垂直）。

來源

2016-06-29 lolio