<style>
div {
  font-family: Ahem;
  font-size: 20px;
  color: transparent;
  border: solid 1px green;
  height: 40px;
  width: 200px;
  margin-bottom: 5px;
}

img {
  margin-right: 10px;
  margin-bottom: 3px;

  margin-left: 2px;
  margin-top: 7px;

  float: left;
  width: 80px;
  height: 20px;
  background-color: blue;
}
</style>
<div style="-webkit-writing-mode: horizontal-tb"><img>X</div>
<div style="-webkit-writing-mode: horizontal-tb; direction: rtl"><img>X</div>
<div style="-webkit-writing-mode: vertical-rl"><img>X</div>
<div style="-webkit-writing-mode: vertical-rl; direction: rtl"><img>X</div>
<div style="-webkit-writing-mode: vertical-lr"><img>X</div>
<div style="-webkit-writing-mode: vertical-lr; direction: rtl"><img>X</div>

<div style="-webkit-writing-mode: horizontal-tb"><img style="float: right">X</div>
<div style="-webkit-writing-mode: horizontal-tb; direction: rtl"><img style="float: right">X</div>
<div style="-webkit-writing-mode: vertical-rl"><img style="float: right">X</div>
<div style="-webkit-writing-mode: vertical-rl; direction: rtl"><img style="float: right">X</div>
<div style="-webkit-writing-mode: vertical-lr"><img style="float: right">X</div>
<div style="-webkit-writing-mode: vertical-lr; direction: rtl"><img style="float: right">X</div>