<!DOCTYPE html>
<style>
#container {
width: 200px; height: 50px;
background-color: orange;
}
#float {
float: left;
width: 50px; height: 50px; background: blue;
}
#verticalTable {
display: table;
width: 50px; height: 50px;
-webkit-writing-mode: vertical-rl;
overflow: hidden;
margin-left: 50%;
background: blue;
}
</style>
<p>You should see four equally sized squares below. Two blue, and two orange.</p>
<div id="container">
<div id="float"></div>
<div id="verticalTable"></div>
</div>