title: Display inline list vertically in CSS
body: <p>I have a menu I'm trying to make for my webpage that would run off to the right side of it and I' want it to be vertical, but I'm having troubles getting the text to align while it's up and down. I really haven't made any headway on getting it to display right at all, but here's the rotation CSS etc:</p>
  <pre><code>#rightmenu {
      border-top: 1px solid #000000;
      border-right: 1px solid #000000;
      border-bottom: 1px solid #000000;
      width:30px;height:578px;
      border-bottom-right-radius:10px;
      border-top-right-radius:10px;
      float:right;
      margin-top:-554px;
  }
      #rightmenu p {
  
      }
      #rightmenu ul {
          width:30px;
          height:20px;
          -ms-transform:rotate(90deg);
          -moz-transform:rotate(90deg);
          -webkit-transform:rotate(90deg);
          -o-transform:rotate(90deg);
          font: 18px normal, sans-serif;
          list-style-type:none;
          padding:0;
          
      }
      #rightmenu li {
          display:inline;
  
      }
  </code></pre>
  <p>Here's what the webpage looks like: <img src="https://i.stack.imgur.com/Q6SBy.png" alt="enter image description here" /></p>
  <p>I want the 'Home' to be rotated like it is, but to go down in a list. So it would start at the top of the webpage like it is now, but instead of the text being below it, it would be to it's right. Ask if I need to clarify, I'm having troubles explaining.</p>