居中按钮文本
如何使文本在这些按钮上垂直和水平居中？
<li id="settings"><a href="settings.html">Settings</a></li>
<li id="logout"><a href="#">Logout</a></li>
使用此 CSS：
/** Buttons **/
#logout{
height:24px;
width:80px;
background-image:url('/gamma/common/images/logoutbg.png');
background-repeat:no-repeat;
margin-top: 6px;
}
#settings{
height:25px;
width:84px;
background-image:url('/gamma/common/images/settingsbg.png');
background-repeat:no-repeat;
margin-top: 6px;
padding-bottom: 25px;
}
#settings a, #logout a{
text-decoration: none;
padding-left: 10px;
margin-bottom: 20px;
padding-top: 0px;
}
#logout a{
color: #344551;
vertical-align: middle;
font-size: 11px;
}
#settings a{
color: #FFF;
vertical-align: middle;
font-size: 11px;
}
我尝试了许多不同的方法，例如更改边距和填充，但文本就是不会移动。
How can I center the text, both vertically and horizontally, on these to buttons?
<li id="settings"><a href="settings.html">Settings</a></li>
<li id="logout"><a href="#">Logout</a></li>
With this CSS:
/** Buttons **/
#logout{
height:24px;
width:80px;
background-image:url('/gamma/common/images/logoutbg.png');
background-repeat:no-repeat;
margin-top: 6px;
}
#settings{
height:25px;
width:84px;
background-image:url('/gamma/common/images/settingsbg.png');
background-repeat:no-repeat;
margin-top: 6px;
padding-bottom: 25px;
}
#settings a, #logout a{
text-decoration: none;
padding-left: 10px;
margin-bottom: 20px;
padding-top: 0px;
}
#logout a{
color: #344551;
vertical-align: middle;
font-size: 11px;
}
#settings a{
color: #FFF;
vertical-align: middle;
font-size: 11px;
}
I've tried many different methods such as changing margin and padding but the text just won't move.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
将
li或a设置为display:block，然后使用属性text-align:center将水平居中。要垂直居中，请尝试设置元素的高度并使用
line-height:30px，其中 30px 是您设置的高度。setting your
lioratodisplay:blockand then using the propertytext-align:centerwill center horizontally.To center vertically, try setting a height on the elements and using
line-height:30pxwhere 30px is the height you've set.