JSFiddle - React, Tailwind, and code Playground

by Tony

HTML

<div class="list">
  <div class="row">
    <div class="name">
      <span>1</span>
      <br />
      <a href="1.php">1</a>
      <br />(2015-09-30)
    </div>

    <div class="info">
      <div class = "info-left">
        <b>Place:</b>
        <br />Now 6
        <br />Later 32
      </div>
      <div class="action">
        <a href="1go.php">Go</a>
      </div>
    </div>
  </div>
</div>

CSS

div.row {
  position: relative;
  border-bottom: 1px dotted #999999;
}
div.list div.name {
  float: left;
  width: 40%;
}
div.list div.info {
  float: left;
  width: 60%;
}
div.list div.action {
  display: inline-block;
  text-align: right;
  vertical-align: middle;
}

.info{
  display: table;
}

div.info div.action{
  display: table-cell;
  vertical-align: middle;
}