鍍金池/ 問答/HTML/ display: flex取消文字垂直居中

display: flex取消文字垂直居中

如何取消文字垂直居中；

我本想用個(gè)display: flex 和overflow-y: scroll 實(shí)現(xiàn)橫行滑動。

可是
clipboard.png

文字垂直居中。怎么解決，網(wǎng)上找了好多都無法解決。

.component-nav{

display: flex;
height: 100px;
width: 750px;   
overflow-y: scroll;
flex-direction:row;

}

.component-nav-list{

display: block;
font-size: 30px;
width: 80px;
height: 30px;
margin: 20px 30px 20px 30px;

}

回答
編輯回答
不將就

看不到你CSS
但我估計(jì)，你這個(gè)不是文字垂直居中，而是包含文字的塊太小了，第二個(gè)字是被擠下去的吧

不知道你到底要什么效果，如果不要換行，可以加個(gè) word-break: keep-all;

.component-nav-list{

display: block;
font-size: 30px;
  word-break: keep-all;
width: 200px;
height: 30px;
margin: 20px 30px 20px 30px;
}
2017年7月20日 00:29
編輯回答
朽鹿

這是文字容器太小 被擠下去的 寬度給多點(diǎn)就可以了

2018年1月20日 17:09