I\'m trying to display tables next to each other horizontally, but this is what I\'m getting.
You have to apply a CSS rule to your tables in order to follow the normal document float which is:
table{ float:left; }
or
.........
PS: Just make sure that this tag selector block won't affect any other tables that you don't them to be so, otherwise you are recommended to use ID or class selectors.