Having trouble lining up 3 boxes with text in them

It's your margins (and padding) that are messing you up. I would say you should step back by removing margin and padding from all three, and then add what you need to get the effect you want. But you need to understand what each of these are: margin is the spacing outside the element, while padding is the space inside the element. You have different margin-top for each, so there should be no surprise that the tops don't line up. And you really shouldn't need to specify heights for these, they will grow as needed.

This is unsolicited advice, but I would suggest that you put all the styles that are the same in all three classes into another class called bubble and then only use bubble1, bubble2, and bubble3 classes for the attributes that you want to be different. It will be much easier to code, as well as to read. Good luck!