我使用一个网站的jQuery UI的布局插件：jQuery UI Layout Hompage如何在jQuery UI布局切换器中使文本垂直？
有选择togglerContent_open和togglerContent_closed，让你把HTML的toggler内。我想在我的EAST窗格中包含文本，但是我的问题是文本横向显示在垂直切换器上，因此只能看到第一个字符。
我怎样才能显示它，以便它读取垂直呢？就像下面的选项一样（很简单，很粗糙的模拟）。这是在jQuery UI布局或只是CSS的选项？
编辑：有谁知道这是否可能通过修改jQuery UI的布局设置？
.parentPane {
border: 1px solid #ccc;
}
.parentPane > div {
display:inline-block;
height:100px;
vertical-align:top;
text-align:center;
}
.eastPane {
background-color:#CA7DBD;
width: 49.5%;
}
.westPane {
background-color:#4679BD;
width: 49.5%;
}
.rotator {
background-color:#ccc;
display:inline-block;
margin-top: 20px;
position:relative;
transform: rotate(90deg);
}
.wizard1 {
left:0;
}
.wizard2 {
right:40px;
;
}
.wizard2 {
right:40px;
;
}
.wizard3 {
right:80px;
;
}
.wizard4 {
right:120px;
;
}<div class="parentPane">
<div class="eastPane">East Pane</div>
<div class="westPane"><div>West Pane</div>
<div class="rotator wizard1">Wizard 1</div>
<div class="rotator wizard2">Wizard 2</div>
<div class="rotator wizard3">Wizard 3</div>
<div class="rotator wizard4">Wizard 4</div>
</div>
</div>您可以使用CSS3 transform财产。这将旋转文本，但是对齐不会将各种这样的容器（div's或span's）分开。因此，您可以使用relative positioning将它们排列在一起。这是您将使用的一般语法rotation。
transform: rotate(90deg);
利用相对定位，您可以定义多个内容之间的距离（文本是垂直的）。
请参见下面的代码片段
.rotator {
background-color:#ccc;
display:inline-block;
margin-top: 20px;
position:relative;
transform: rotate(90deg);
}
.wizard1 {
left:0;
}
.wizard2 {
right:40px;;
}
.wizard2 {
right:40px;;
}
.wizard3 {
right:80px;;
}
.wizard4 {
right:120px;;
}<div class="rotator wizard1">Wizard 1</div>
<div class="rotator wizard2">Wizard 2</div>
<div class="rotator wizard3">Wizard 3</div>
<div class="rotator wizard4">Wizard 4</div>希望这有助于！