html - Table inside inline-block element breaks vertical alignment -


when putting table inside inline-block element, inline-block elements next shifted down, instead of tops of elements being aligned.

html

<div>     <table>         <tr>             <td>cell</td>             <td>cell</td>         </tr>         <tr>             <td>cell</td>             <td>cell</td>         </tr>     </table> </div>  <div>element</div> <div>element</div> 

css

div {     display: inline-block;     border: 1px solid #000; } 

result

http://i.gyazo.com/1734f13a3da745e22ada8c93d18f8d4b.png

jsfiddle

http://jsfiddle.net/dk39j/1/

why happen, , can prevent it?

you need set vertical-align:top; divs beside it

jsfiddle


Comments

Popular posts from this blog

windows - Single EXE to Install Python Standalone Executable for Easy Distribution -

c# - Access objects in UserControl from MainWindow in WPF -

javascript - How to name a jQuery function to make a browser's back button work? -