CSS
.vertical-text {
-ms-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
-ms-transform-origin: left top 0;
-moz-transform-origin: left top 0;
-webkit-transform-origin: left top 0;
transform-origin: left top 0;
background: #E23737;
color: #fff;
margin-left: 40px;
padding: 10px;
border: 1px solid #ccc;
text-transform: uppercase;
border: 1px solid #B52C2C;
text-transform: 1px 1px 0px rgba(0, 0, 0, 0.5);
box-shadow: 2px -2px 0px rgba(0, 0, 0, 0.1);
float: left;
}
HTML
<div class="verticle-text">pranaysonisoft.blogspot.com</div>
.vertical-text {
-ms-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
-ms-transform-origin: left top 0;
-moz-transform-origin: left top 0;
-webkit-transform-origin: left top 0;
transform-origin: left top 0;
background: #E23737;
color: #fff;
margin-left: 40px;
padding: 10px;
border: 1px solid #ccc;
text-transform: uppercase;
border: 1px solid #B52C2C;
text-transform: 1px 1px 0px rgba(0, 0, 0, 0.5);
box-shadow: 2px -2px 0px rgba(0, 0, 0, 0.1);
float: left;
}
HTML
<div class="verticle-text">pranaysonisoft.blogspot.com</div>