Div boxes not aligning properly using inline-block

Question

I have some very simple code which works perfect for what look I\'m trying to achieve. I have two divs which are displayed as \"boxes\" which are contained within an outer div w

Answer 1

.box {
  display: inline-block;
  border: solid 1px;
  vertical-align: top;
  width: 40%;
}

  

    
BOX 1
    
Lorem ipsum dolor sit amet, altera interesset pri an. Et aeque interpretaris vel, at quo summo deleniti disputationi. Eu inimicus splendide duo, soleat intellegam ut per. Sint impedit recusabo ex vix, aliquid adipisci consequat no ius. Eu possim consequat eum, sea cu quaeque impedit, est fuisset accusamus definiebas ad.
  

  

    
BOX 2
    
Viris eruditi consectetuer ei mea, eu nulla ridens officiis duo. In atomorum forensibus abhorreant quo, id nec aperiam dissentiet.
  

You can use the vertical-align CSS property.

It has effect only on inline, and inline-block elements.

This is a great reference on vertical-align.