Question

I am trying to align some divs in a horizontal row structure. There is a div container which has child divs, and these child divs should be in the same row. There can be many container divs like these, having different ids but the same class name.

How can I do that? Here is the jsFiddle I attempted: http://jsfiddle.net/unix_user/VSd6Y/6/.

Answer 1

Use display:inline-block. This way your div will stack up next to each other and you are able to specify widths and other attributes common to block elements.

Check out the updated fiddle. You can see that the divs styled with container are on separate lines, but the child divs are stacked next to each other.