我没有任何运气与垂直文本混合引导。我也试图垂直对齐在div中的文本,一旦我得到这个工作。解释它的最好方法就是真正地展示它。这里是小提琴- https://jsfiddle.net/gx1Lb2jf/4/,你可以看到垂直文本不是向下推到div。
下面是脱手的密码:
<div class="col-xs-12">
<div class="col-xs-12 border-container">
<div class="col-xs-1">
<div class="vertical-text">dafadsf sda fd sf</div>
</div>
<div class="col-xs-11">
dfg dsfgdsfsg dsfg dsfg asdf sad gsdf asdf asdf asdf asdf asdf asdf asdf alkfhads lkfjhads lkfjhsadl kfjhaslkf dfg dsfgdsfsg dsfg dsfg asdf sad gsdf asdf asdf asdf asdf asdf asdf asdf alkfhads lkfjhads lkfjhsadl kfjhaslkf dfg dsfgdsfsg dsfg dsfg asdf sad gsdf asdf asdf asdf asdf asdf asdf asdf alkfhads lkfjhads lkfjhsadl kfjhaslkf dfg dsfgdsfsg dsfg dsfg asdf sad gsdf asdf asdf asdf asdf asdf asdf asdf alkfhads lkfjhads lkfjhsadl kfjhaslkf
</div>
</div>
</div>
.vertical-text {
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-transform-origin: 50% 50%;
-moz-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
-o-transform-origin: 50% 50%;
transform-origin: 50% 50%;
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
text-transform: uppercase;
}
.border-container {border:2px solid #000}
.border{border:2px solid red}
.go-right{float:right}
.go-left{float:left}
.nopad{padding:0}发布于 2015-09-22 14:06:35
根据另一个问题找到答案..。我把它改了一点,就在这里-- http://jsfiddle.net/CCMyf/274/希望它能帮到别人。
Code on fiddle page above.https://stackoverflow.com/questions/32704774
复制相似问题