title: word-wrap in div with display:inline-block doesn't work
body: <p>I've been trying to figure out how to make a row with 4 colums using div-elements.</p>
  
  <p>The first and the third column should be 46px wide. The second and fourth column should be 50%  of the left place (like 100% window width - 46*2) wide. I realized that already as you can see <a href="http://jsfiddle.net/5p5V9/" rel="nofollow">here</a> in the first grey box.</p>
  
  <p>Well, the text of the second and fourth column can be longer and I want it to break in the div .</p>
  
  <p>The second grey box shows you how it looks like when the text is longer.
  The third grey box shows you another try with 'display:table-cell'. The only problem is that the width of 50% of the second column just decreases while the width of the fourth column increases.</p>
  
  <p>I need both columns to have the same width. Have you got an idea how I to achieve it?
  Thank you in advance. </p>