垂直文本对齐

css3

2013-03-12 219 views 0 likes

我有一个不同长度的垂直页面标签，即新闻，奖项，出版物。我希望文本从相同的最高点开始（如果文本是水平的，那么它就是正确的）并从这一点开始下降。我不得不使用内联样式将文本向下推到正确的位置。我尝试将高度和宽度设置为500，这似乎适用于对齐，但将div推向正确的方向。垂直文本对齐

.vert_text { 
position: relative; 
color: #fff; 
text-transform: lowercase; 
font-family: Arial; 
font-size: 6em; 
-webkit-transform: rotate(-90deg); 
-moz-transform:rotate(-90deg); 
-ms-transform:rotate(-90deg); 
float:left; 
width:100px; 
} 

<div class="vert_text"> 
news 
</div> 
<div class="vert_text"> 
publications 
</div>

来源

2013-03-12 blikejas

回答

使用行高和定义的高度例如：

.vert_text { 
    height:6em; 
    line-height:6em; 
}

看到这个工作fiddle。

来源

2013-03-12 17:35:05 soyuka

文字需要垂直请在这里看到我的小提琴，http://jsfiddle.net/Qv2rs/ – blikejas 2013-03-12 17:41:05

我不明白你想做什么。你想在每个垂直文本之间留出空间吗？ – soyuka 2013-03-12 17:48:07

不，我不需要垂直文本的最后一个字母在同一个位置，而不需要内联样式。请看这里的新闻，奖项和出版物链接http://lightingdesignalliance.com/news/index-jas/ – blikejas 2013-03-12 17:54:08

.var_text{ 
margin-top:0px; 
}

或

删除位置：相对

然后添加

余量：0像素或边距：0像素;

来源

2013-03-12 17:35:42

我为此创建了一个小提琴，你可以在这里展示你的意思吗？ http://jsfiddle.net/Qv2rs/ – blikejas 2013-03-12 17:39:23

垂直文本对齐

回答

相关问题