JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper" id="method1">
  <div class="content">asdfaskjdfakjsd</div>
  <div class="submit">
    <input type='submit' value='asdf' />
  </div>
</div>

<div class="wrapper" id="method2">
  <div class="content">asdfaskjfakjsd</div>
  <div class="submit">
    <input type='submit' value='asdf' />
  </div>
</div>

<div class="wrapper" id="method3">
  <div class="content">asdfaskjdfakjsd</div>
  <div class="submit">
    <input type='submit' value='asdf' />
  </div>
</div>

<div class="wrapper" id="method4">
  <div class="submit">
    <input type='submit' value='asdf' />
  </div>
  <div class="content">asdfaskjdfakjsd</div>
</div>

<div class="wrapper" id="method5">
  <div class="content">asdfaskjdfakjsd</div>
  <div class="submit">
    <input type='submit' value='asdf' />
  </div>
</div>

CSS

.wrapper {
    border: 1px solid #0f0;
    margin: 10px;
    width: 300px;
}

.content {
    border: 1px solid #f00;
    margin: 5px;
    text-align:center;
}

.submit {
    border: 1px solid #00f;
    margin: 5px;
}

#method1::before, #method1::after {
    *zoom: 1;
    content: '';
    display: table;
}

#method1::after {
    clear: both;
}

#method1 .content {
    float: left;
}

#method1 .submit {
    float: right;
}

#method2 .content {
    display: inline-block;
}

#method2 .submit {
    float: right;
}

#method3 {
    display: table;
    padding: 5px;
    width: 290px;
}

#method3 .content, #method3 .submit {
    display: table-cell;
}

#method3 .submit {
    text-align: right;
}

#method4::before, #method4::after {
    *zoom: 1;
    content: '';
    display: table;
}

#method4::after {
    clear: both;
}

#method4 .submit {
    float: right;
}

#method5 {
    position: relative;
}

#method5 .submit {
    position: absolute;
    right: 0;
    top: 0;
}