positioning a rotated div

HTML

<div class="tab">Test Tab</div>

<div class="tab" id="secondTab">Test Tab</div>

<div class="content">
    

</div>

CSS

body {
    margin: 0;
    padding: 0;
}

.tab { 
    border: solid 1px red; 
     width: 200px; height: 40px;
    -webkit-transform: rotate(-90deg);
    -webkit-transform-origin: 0 0;
    -moz-transform: rotate(-90deg);
    -moz-transform-origin: 0 0;
    -o-transform: rotate(-90deg);
    -o-transform-origin: 0 0;
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    -ms-filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    position: absolute;
    top: 212px;
    left: 10px;
}

#secondTab{
    top:420px;
}