display: table-cell and maximum height

dabblet.css

/* display: table-cell and maximum height */

body {margin-top: 50px;}

.block {
  width: 100%;
  display: table;
}

.left, .right {
  display: table-cell;
  outline: 1px solid rgb(255, 218, 237);
}
.left {
  width: auto;
}
.right {
  width: 320px;
}

.leftinner {
  height: 200px;
}
.rightinner {
  display: inline-block;
  width: 100%;
  height: 100%;
  margin-left: 10px;
  padding-left: 10px;
  border-left: 1px dashed blue;
}

dabblet.html

<div class=block>
  <div class=left><div class=leftinner>variable height (from content)</div></div>
  <div class=right><div class=rightinner>should expand to full height</div></div>
</div>

settings.json

{"view":"split","prefixfree":"1","page":"css"}