How to get these two divs side-by-side?

Question

I have two divs that are not nested, one below the other. They are both within one parent div, and this parent div repeats itself. So essentially:

Answer 1

Since div's by default are block elements - meaning they will occupy full available width, try using -

display:inline-block;

The div is now rendered inline i.e. does not disrupt flow of elements, but will still be treated as a block element.

I find this technique easier than wrestling with floats.

See this tutorial for more - http://learnlayout.com/inline-block.html. I would recommend even the previous articles that lead up to that one. (No, I did not write it)