html - display buttons on the same line at opposite sides of the page -

i have left , right buttons want display navigation buttons @ top , bottom of content on page this:

<div style="float: right;">          <button class="right">right button</button> </div> <div>            <button class="left">left button</button> </div>  <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. vivamus sagittis faucibus feugiat. suspendisse felis tortor, sodales quis scelerisque a, malesuada lobortis erat. etiam vel lectus vitae nulla imperdiet dapibus. curabitur accumsan pretium viverra.  vivamus sit amet gravida ante. aenean elit lorem, aliquet porta sollicitudin non,  elementum aliquam massa. ut magna arcu, malesuada lacinia rutrum ornare, accumsan sed  eros.</p>  <div style="float: right;">          <button class="right">right button</button> </div> <div>            <button class="left">left button</button> </div> 

the problem have (as seen here) if have right buttons not left buttons, using float floats button right of paragraph (which normal because that's comes after button), if use text-align: right instead of float right, works fine. there better way can without having check conditions see if left buttons exist , change float text-align?

thank you

don't use float:right, it's ok with

<div style="text-align: right;clear:left;">