Edit on
<div class="container">
  <div class="box one">
    <div class="x">X</div>
    <div class="y">Y</div>
    <div class="name">1</div>
  </div>
</div>
<div class="container">
  <div class="box two">
    <div class="x">X</div>
    <div class="y">Y</div>
    <div class="name">2</div>
  </div>
</div>
<div class="container">
  <div class="box three">
    <div class="x">X</div>
    <div class="y">Y</div>
    <div class="name">3</div>
  </div>
</div>
.one {
  transform:rotateY( 45deg ) rotateZ( 90deg );
}
.two {
  transform:rotateZ( 90deg ) rotateY( 45deg );
}
.three {
  transform: rotate3d( 0, 1, 2, 90deg );
}

/* ------------------------------------------- */

.container {
	perspective: 800px;
	width: 200px;
	margin: 20px;
  float:left;
  border:1px solid grey;
}

.box {	
  background: #222;
  position:relative;
	width: 200px;
	height: 200px;
  border:1px solid white;
  color:#fff;
}

.x {
  position:absolute;
  left:100px;
  bottom:5px;
}
.y {
  position:absolute;
  top:100px;
  left:5px;
}
.name {
  position:absolute;
  top:100px;
  left:98px;
}
Rerun