How can I have two DIV s on the same line , one aligned to the left and one aligned to the right without an HTML table?

Question

I want the votediv on the right, independent of the text size of the article with class name "note". what happens if I assign

<div class="votediv" style="right:0; position:relative">

on css?

<div class="opiniondiv">
        <article class="opinion"></article>
        <div class="opiniondetail">
          <article class="note"></article>
          <div class="votediv">
            <form method="POST">
              <button class="agreebutton" value="1">Agree</button>
              <button class="disagreebutton" value="0">Disagree</button>
            </form>
          </div>
        </div>
      </div>

also, I want to do it without using

display:table

Answer 1

For <div class="votediv" style="right:0"> to work you have to add position: absolute to the style. And after that you would probably want to add position: relative to div.opiniondiv.

Edit

And if you are to float the divs as others suggests here, please do not forget to clear or you will have a total mess.

http://www.positioniseverything.net/easyclearing.html