Rafael Casimiro Rafael Casimiro - 3 months ago 21
CSS Question

html class dont stay inline

why does the div's dont stay in line but stay like this: http://i.stack.imgur.com/Apr9T.png

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;


}

is a any problem with the class?

Answer

by it's nature goes to the next line and don't stack next to each other

However you can add

float:left;

to your products class.

example: http://codepen.io/nilestanner/pen/OXYPja