html table tag not displaying all the cell elements in same column of various rows alligned -

html table tag not displaying all the cell elements in same column of various rows alligned -

html table tag not working required

i have tried 100% width not helping cells sized according content , not same in same column. thanx lot help in advance!

why not utilize divs?

that's html:

<div class="column1">111111111111111</div><div class="column2"><img src="http://i1129.photobucket.com/albums/m517/fireballx576/0e1252115_overflow_zpsd61dbce3.jpg" /></div><div class="column3">333333333333333</div>

that's css:

.column1, .column2, .column3 { width: 100px; height: 300px; display: inline-block; overflow-x: hidden; /* prevents content expanding cells */ border: 1px solid #f00; }

here's jsfiddle: http://jsfiddle.net/trb6z1s4/1/

html