HTMLクラスが滞在していませんインライン

Question

なぜ、むしろこのようなラインではないのdiv滞在：

HTML：

<div id="NovosProdutos"> 
    <div id="name"> 
     <h1>Novos produtos</h1> 
    </div> 
    <div id="produtos"> 
     <div class="product"><h1>product 1</h1></div> 
     <div class="product"><h1>product 2</h1></div> 
     <div class="product"><h1>product 3</h1></div> 
    </div> 
</div> 

CSS：

#name { 
    height: 25px; 
    font-size: 8px; 
    font-family: Georgia, serif; 
    border-style: ridge; 
    border-color: #38c23d; 
    border-width: 0px 0px 2.5px; 
} 

#produtos { 
    height: 190px; 
} 

.product { 
    width:162.5px; 
    height: 155px; 
} 

クラスに問題はありますか？

Answer 1

<div>が自然だとあなたがあなたの製品クラスに

float:left; 

を追加することができますしかし、互いに

の隣に積み重ねないでください：参照してください。

例：.productにインラインブロック： http://codepen.io/nilestanner/pen/OXYPja

Answer 2

デフォルトでは、<div>の表示プレゼンテーションスタイルはblockです。 inlineと表示されているものを使用するか、CSSの指定された<div>のプロパティを設定することができます。次の行に行くことによってHow do you make div elements display inline?