you moved the avatar-blocks right into the bubble-block.
it only has to be in the container-block (and before or behind the bubble-block ^^)

with blocks i mean lines of code with the same topic (for example: container, avatar, bubble, text, time, ...) which are encircled by <div> ... </div> tags.
(as you see you should only mark block which look like <div> ... </div> or <div> <div> ... </div> </div> and so on.... in short: make sure that the open-tag has an end-tag at the end of the marked part)

edit: of course you can move <span> ... </span> blocks around too. the alignment is done via the css-file.

one of the first google search results - a explanation and tutorial on div and span: http://www.html.net/tutorials/CSS/lesson8.asp