帶有編號的HTML水平順序列表

Question

爲了獲得編號，我使用了一個有序列表，當列表是垂直時，這完美地工作。但是，一旦我將其水平放置，編號就會消失。

li CSS中的顯示屬性似乎是罪魁禍首。

CSS和HTML：

#QuickSteps { 
 
    width:723px; 
 
    height:75px; 
 
    border:solid 2px #b9c7d9; 
 
    background-color:#e5ecf2; 
 
} 
 

 
#QuickSteps h2{ 
 
    padding-top:2px; 
 
    padding-left:7px; 
 
} 
 

 
#QuickSteps ol{ 
 
    color:#003366; 
 
} 
 

 
#QuickSteps li { 
 
    display:inline; 
 
} 
 

 
#QuickSteps li.selected{ 
 
    font-weight:bold; 
 
}

<div id="QuickSteps"> 
 
    <h2>5 Quick Steps</h2> 
 
    <ol> 
 
    <li class="selected">Account Info ></li> 
 
    <li>About Me ></li> 
 
    <li>Preferences ></li> 
 
    <li>Habits ></li> 
 
    <li>Your Avatar</li> 
 
    </ol> 
 
</div>

Answer 1

而是內嵌顯示他們，你可以把它們飄浮

#QuickSteps li { 
    float:left; 
    margin-left:50px; 
} 

好運...