title: Placing a vertical rotated text inside a div
body: <blockquote>
    <p><strong>Possible Duplicate:</strong><br>
    <a href="https://stackoverflow.com/questions/1080792/how-to-draw-vertical-text-with-css-cross-browser">How to draw vertical text with CSS cross-browser?</a>  </p>
  </blockquote>
  
  
  
  <p>I have some divs, supposed to be "books" on a shelf. All the div is supposed to be a link, and while in some cases they will have image backgrounds, in some others they won't and in those cases I need to put the title like if it was, well, a book, so the text should be rotated 90º. I'm not sure how to do that, rotate just the text inside the <code>&lt;a&gt;</code>, without rotating the entire div.</p>
  
  <pre><code>&lt;div class="magazinebookcase"&gt;        
  
  &lt;div class="books"&gt;
  &lt;a title="Mag1" style="height:286px;width:16px;" href=""&gt;Book 1
  &lt;/a&gt;
  &lt;/div&gt;
  &lt;div class="books"&gt;
  &lt;a title="Mag2" style="height:258px;width:48px;" href=""&gt;Book 2
  &lt;/a&gt;
  &lt;/div&gt;
  &lt;div class="books"&gt;
  &lt;a title="Mag3" style="height:252px;width:38px;" href=""&gt;
  &lt;/a&gt;
  &lt;/div&gt;
  &lt;div class="books"&gt;
  &lt;a title="Mag4" style="height:258px;width:50px;" href=""&gt;
  &lt;/a&gt;
  &lt;/div&gt;       
  &lt;div class="books"&gt;
  &lt;a title="Mag5" style="height:284px;width:14px;" href=""&gt;
  &lt;/a&gt;
  &lt;/div&gt;
  
  &lt;div class="clearfix"&gt;&lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>And the CSS:</p>
  
  <pre><code>.magazinebookcase {
  width: 100%;
  padding: 3px;
  vertical-align:bottom;
  
  } 
  
  .magazinebookcase .clearfix {
  clear:both;
  }
  
  .magazinebookcase .books {
  text-align:center;
  display: table-cell;
  vertical-align: bottom;
  }
  
  .magazinebookcase a {
  border: 1px solid #000;
  display: block;
  word-break: break-all;
  }
  
  .magazinebookcase a:hover {
  background-color: #ccc;
  }​
  </code></pre>
  
  <p><a href="http://jsfiddle.net/7vEdw/2/" rel="nofollow noreferrer">http://jsfiddle.net/7vEdw/2/</a></p>