JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Page Title</title>
</head>
<body>
  <div class="box">
      <div class="col1">a</div>
      <div class="col2">b</div>
  </div>
</body>
</html>

CSS

.box {
    display: -webkit-box;
    display: -moz-box;
    display: box;
    width: 100%;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    box-orient: horizontal;
}

.box > div { width: 0; }

.box > .col1 {
    -webkit-box-flex: 1.5;
    -moz-box-flex: 1.5;
    box-flex: 1.5;
    background-color: #fcc;
    padding-right: 15px;
}

.box > .col2 {
    -webkit-box-flex: 8.5;
    -moz-box-flex: 8.5;
    box-flex: 8.5;
    background-color: #cec;
    padding-left: 15px;
}