JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="price-list">
  <li class="standard">
    <ul class="price-wrapper">
      <li class="monthly is-visible">
        <header>
          <h2>$100</h2>
        </header>
        <main>
          <ul class="features">
            <li>Awesome</li>
            <li>Wins life</li>
            <li>Bakes cookies</li>
          </ul>
        </main>
        <footer>
          <a>Buy now!</a>
        </footer>
      </li>
      <li class="annual is-hidden">
        <header>
          <h2>$1000</h2>
        </header>
        <main>
          <ul class="features">
            <li>Awesome</li>
            <li>Wins life</li>
            <li>Bakes cookies</li>
          </ul>
        </main>
        <footer>
          <a>Buy now!</a>
        </footer>
      </li>
    </ul>
  </li>
  <li class="pro">
    <ul class="price-wrapper">
      <li class="monthly is-visible">
        <header>
          <h2>$300</h2>
        </header>
        <main>
          <ul class="features">
            <li>Same as standard</li>
            <li>No new features</li>
            <li>Just more expensive</li>
            <li>However</li>
            <li>A longer feature list</li>
            <li>For no reason</li>
          </ul>
        </main>
        <footer>
          <a>Buy now!</a>
        </footer>
      </li>
      <li class="annual is-hidden">
        <header>
          <h2>$3000</h2>
        </header>
        <main>
          <ul class="features">
            <li>Awesome</li>
            <li>Wins life</li>
            <li>Bakes cookies</li>
            <li>However</li>
            <li>A longer feature list</li>
            <li>For no reason</li>
          </ul>
        </main>
        <footer>
          <a>Buy now!</a>
        </footer>
      </li>
    </ul>
  </li>
</ul>

CSS

body {
  background-color: #999;
}

.price-list {
  display: table;
  table-layout: fixed;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.price-list > li {
  display: table-cell;
  padding: 0 10px;
}

.price-wrapper {
  background-color: #fff;
  list-style: none;
  margin: 0;
  padding: 0;
}

.is-visible footer {
  width: 100%;
  height: 30px;
  background-color: #99c;
}

/* For demonstration purposes */
.is-hidden {
  display: none;
}