Question

I’m having issues with this box model. I was having the issue only with Blackberry 4.6, but it’s happening on jsbin/jsfiddle as well. These 2 divs should be 50% and therefore sit directly next to each other, but the last one is breaking down.

jsbin: http://jsbin.com/oyujof/1/edit

Thanks in advance.

Answer 1

Whitespace is significant when it comes to inline and inline-block elements. Remove or comment out the whitespace between the divs.

Clarification: the whitespace is the newline character and spaces between the divs:

  </div>\n
  __<div class="nav-button">

These will render as a single space when you use inline or inline-block.