Buttons On Top Of Each Other Not Side By Side?

I have two buttons, that I was hoping to have side by side, however their right on top of each that I can't figure out why.. here's what i'm looking at. here's my code. CSS: but

Solution 1:

position:absolute removes the elements from the normal document flow. Thus, they will be positioned on top of each other where specified (top: 250px;, left: -15px;) since they share the same position styles.

For your scenario, it would probably be better to use floats and margins:

button {
    float:left;
    margin-top:250px;
}

Solution 2:

In general, position: absolute; should be avoided; you're taking an element out of the standard flow (which means no more side by side or top to bottom reflowing).

If you insist on using it, you need two different positioning rules for your buttons so you can assign them to different places.

Solution 3:

Try position:static; I read that it renders elements in order as they appear in the document flow.