表示：インラインブロックが機能していない

Question

ウェブサイトの作成を開始して練習中ですが、画像を水平に表示する際に問題がありました。私はdisplay：inline-blockを使ってみましたが、画像は垂直のままです。申し訳ありませんが、これは簡単な間違いですが、何時間も私を悩ませています。部分的なHTML：

/*Main CSS*/ 
 

 
/*All Styling*/ 
 

 
* { 
 
    background-color: #f2f2f2; 
 
} 
 
/*All Text Styling*/ 
 

 
a { 
 
    text-decoration: none; 
 
    color: gray; 
 
    font-family: 'Open Sans Condensed', sans-serif; 
 
} 
 
/*Visited Page and Hover Link Color*/ 
 

 
a:visited, 
 
a:hover { 
 
    color: #838383; 
 
} 
 
/*Body Styling*/ 
 

 
body {} 
 
/*Section and Footer Wrapper*/ 
 

 
#sfwrapper { 
 
    max-width: 940px; 
 
    background: #f2f2f2; 
 
    text-align: center; 
 
    font-size: 1em; 
 
    color: gray; 
 
} 
 
/*Ordered Lists*/ 
 

 
ol { 
 
    list-style-type: none; 
 
} 
 
/*Head*/ 
 

 
h1 { 
 
    text-align: center; 
 
    font-weight: normal; 
 
    line-height: 0.5em; 
 
    color: #8c8c8c; 
 
} 
 
/*Subhead*/ 
 

 
h2 { 
 
    text-align: center; 
 
    font-weight: normal; 
 
    color: #8c8c8c; 
 
} 
 
/*NAV Styling*/ 
 

 
nav { 
 
    text-align: center; 
 
    padding: 10px 0; 
 
} 
 
/*Gallery Styling*/ 
 

 
#gallery { 
 
    display: inline-block; 
 
} 
 
/*Footer Styling*/ 
 

 
footer { 
 
    font-size: 0.75em; 
 
}

<ol id="gallery"> 
 
    <li> 
 
    <a href="img/placeholder.png"> 
 
     <img src="img/placeholder.png" alt=""> 
 
    </a> 
 
    <p>placeholder</p> 
 
    </li> 
 
    <li> 
 
    <a href="img/placeholder.png"> 
 
     <img src="img/placeholder.png" alt=""> 
 
    </a> 
 
    <p>placeholder</p> 
 
    </li> 
 
    <li> 
 
    <a href="img/placeholder.png"> 
 
     <img src="img/placeholder.png" alt=""> 
 
    </a> 
 
    <p>placeholder</p> 
 
    </li> 
 
    <li> 
 
    <a href="img/placeholder.png"> 
 
     <img src="img/placeholder.png" alt=""> 
 
    </a> 
 
    <p>placeholder</p> 
 
    </li> 
 
</ol>

Answer 1

はCSSでliにdisplay: inline-block;ポップ。ここで

#gallery li { 
    display: inline-block; 
} 

は実際の例です：http://codepen.io/alexmccabe/pen/VjzzjZ、私の追加されたコードは、CSSの一番下にあります。

非常に正当な理由がない限り、私は要素にIDを使用しないようにしています。将来的には特定の問題を引き起こす可能性があります。