html - 回転したタブ (Transform:rotate) の配置

Question

これまでの私の現在のコードは次のとおりです。

http://jsfiddle.net/VsGMa/2/ ご覧のとおり、タブが正しく配置されていません。

正常に動作する「水平」バージョンは次のとおりです。

http://jsfiddle.net/HHg7S/

何が間違っているのか、どうすれば正しく整列できるのかについてのアイデアはありますか?

transform-origin は 0% 100% になりました - 他の値も試してみましたが、うまくいきませんでした。

Answer 1

これを試して、

<div class="slick-tab slick-tab-270 slick-tab-open" style="background-image: none; background-color: rgb(102, 255, 0); border: 3px solid rgb(0, 0, 0); padding: 0px ! important; -moz-transform-origin: 0% 100%; -moz-transform: rotate(270deg); text-align: center; height: auto; position: absolute; margin-left: -3px; width: 100px; margin-top: 68px;">

margin-top:68px;このdivに挿入するだけです。

これを表示してください：http://jsfiddle.net/VsGMa/3/