Css 垂直文本，以div为中心

我一直坚持让文本（单行）垂直运行，并在容器中保持居中，从左到右，从上到下

我如何使用CSS完成它

text-align:center;
line-height:1000px;
-moz-transform:rotate(-270deg); 
-moz-transform-origin: bottom left;
-webkit-transform: rotate(-270deg);
-webkit-transform-origin: bottom left;
-o-transform: rotate(-270deg);
-o-transform-origin:  bottom left;
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);

希望有帮助：）

---

希望有帮助：）

使用

transform

属性旋转div这是css和

padding

用于垂直居中对齐和

文本对齐

用于垂直居中对齐。交叉浏览器解决方案：

div {
    margin: 50px;
    width: 100px;
    text-align: center;
    height: 50px;
    background: red;
    -moz-transform: scale(1) rotate(90deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        -webkit-transform: scale(1) rotate(90deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        -o-transform: scale(1) rotate(90deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        -ms-transform: scale(1) rotate(90deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        transform: scale(1) rotate(90deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
}
p {
    margin: auto;
    padding: 15px;
}

现场演示：

---

UPD:您可以在此生成器中轻松编辑css3属性（如

transform

）：

使用

transform

属性旋转div这是您的css和

padding

用于垂直居中对齐和

文本对齐

用于垂直居中对齐。交叉浏览器解决方案：

div {
    margin: 50px;
    width: 100px;
    text-align: center;
    height: 50px;
    background: red;
    -moz-transform: scale(1) rotate(90deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        -webkit-transform: scale(1) rotate(90deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        -o-transform: scale(1) rotate(90deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        -ms-transform: scale(1) rotate(90deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        transform: scale(1) rotate(90deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
}
p {
    margin: auto;
    padding: 15px;
}

现场演示：

---

UPD:您可以在此生成器中轻松编辑css3属性（如

transform

）：

首先以您喜欢的方式放置文本，而无需尝试执行旋转

---

应用`变换：旋转（-90度）；与div上的供应商详细信息一起

首先以您喜欢的方式发布文本，而不尝试执行轮换

---

应用`变换：旋转（-90度）；连同您的div上的供应商详细信息

此填充仅用于查看右中角？我不认为它是一个真正的汽车中心是的，它是。但你们知道你们的div的宽度和高度，所以你们可以很容易地将它设置为实际值。这个填充物只是为了观察中间的右边？我不认为它是一个真正的汽车中心是的，它是。但您知道div的宽度和高度，所以可以轻松地将其设置为实际值