html - CSSでインラインリストを縦に表示

Question

Web ページ用に作成しようとしているメニューが右側にはみ出しており、垂直にしたいのですが、テキストを上下に揃えるのに問題があります。私は実際にそれを正しく表示するために何の進歩も遂げていませんが、回転CSSなどは次のとおりです。

#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;

    }

ウェブページは次のようになります。

「ホーム」をそのまま回転させたいのですが、リストを下に移動します。したがって、現在のように Web ページの上部から開始されますが、テキストがその下にあるのではなく、右側になります。明確にする必要があるかどうか尋ねてください。説明に問題があります。