My div are not aligned horizontally

Question

I'm using two div with display: inline-block but these are not aligned horizontalme.

If I make the div with the same information, text and images, div align, but if there is more text than another, not aligned in some div.

i attach sample image and implemented code.

Thanks for the help

CSS:

.serv_op{
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;    
    border-radius: 20px;
    border: 1px solid #999; 
    height:330px;
    text-align:center;
    background:#E2E2E1;
    display:inline-block;
    width:350px;
}

HTML:

<div align="center" class="serv_op">
    <br>
    <img src="img/certificado.jpg">
    <div style="clear:both"></div>
    <div class="serv_titulo_op">CERTIFICADOS</div>
    <div style="clear:both"></div>
    <div class="serv_text_op">Estamos certificados por la SUPER INTENDENCIA DEVIGILACIA  Y SEGURIDAD PRIVADA </div>
</div>  

<div align="center" class="serv_op">
    <br>
    <img src="img/certificado2.jpg">
    <div style="clear:both"></div>
    <div class="serv_titulo_op">UN AÑO DE GARANTÍA</div>
    <div style="clear:both"></div>
    <div class="serv_text_op">En Security On siempre estamos pensando en su bienestar y en el de su establecimiento, por eso te ofrecemos  un año de garantía por defecto de fábrica.</div>
</div>  

Answer 1

Try vertical-align: top

Fiddle

Answer 2

The way you have written the code can be better.. You can fix it with various approaches. See my option.

http://jsfiddle.net/kiranvarthi/Lyz505ds/1/

<div class="serv_op">
  <img src="img/certificado.jpg" />
  <div class="serv_titulo_op">CERTIFICADOS</div>
  <div class="serv_text_op">Estamos certificados por la SUPER INTENDENCIA DEVIGILACIA  Y SEGURIDAD PRIVADA </div>
</div>  

<div  class="serv_op">
  <img src="img/certificado2.jpg" />
  <div class="serv_titulo_op">UN AÑO DE GARANTÍA</div>
  <div class="serv_text_op">En Security On siempre estamos pensando en su bienestar y en el de su establecimiento, por eso te ofrecemos  un año de garantía por defecto de fábrica.</div>
</div> 

Answer 3

你已经在你的CSS部分做了更改

.serv_op{ -moz-border-radius: 20px; -webkit-border-radius: 20px;
border-radius: 20px; border: 1px solid #999; height:330px; text-align:center; background:#E2E2E1; display:inline-block; width:350px; float:left; margin-left:10px; }