relative positioning of chat bubbles from Mysql output

Hello Tony

I am developing an android chat app using appiventor and i am using below HTML to put the content of MySQL output into my android app. However i notice the messages get overwritten every time with the new content and i wanted each message to appear one by one, just like any other conversation. i struggled for the past couple of days, but could not find a solution. i am a novice to HTML and any help would be greatly appreciated.


PS : i am using CSS within the HTML since an outside CSS is not supported by the appinventor.

my html code below :

Syndicate content