vertical alignment - Inline-block not vertically aligning div-elements correctly -
i've got problem chrome.
i'm trying vertically-align divelements using display: inline-block; instead of floating them. problem occurs when put text them: strange reason, chrome displays differently filled divs onto different lines.
firefox , ie working correctly. better understanding check this example
how can avoid this?
you need add global wrapper font-size: 0; , set regular font size inline blocks, can add: letter-spacing: 0; , word-spacing: 0;, this:
.wrapper { font-size: 0; letter-spacing: 0; word-spacing: 0; } .wrapper .inline_block { display: inline-block; font-size: 12px; letter-spacing: 1px; word-spacing: .1em; vertical-align: top; } and example fiddle: http://jsfiddle.net/3ab22/ , updated fiddle: http://jsfiddle.net/3ab22/3/
Comments
Post a Comment