Without using table, how can I align two elements (one at left, another at right) in the same line?
I have made an example for you to understand the elements a bit better. With using a float you can 'move'(float) elements to a specific side (left or right).
Depending on what you want, you can float everything to the left, which makes every element 'stick' to the other element as long as the width's of the elements do not exceed the parent element width. Otherwise they will 'fall' under the element to fit the width. For instance this code where the container has a width of 600px. Each class 'test' has a width of 250px. This will result in 2 elements next to each other, but the other one will fall under it.
a
b
c
http://jsfiddle.net/qBR9M/4/
The best way to play with this is the give your elements a background-color, so you can see how the respond.