gpt4 book ai didi

html - 如何水平居中绝对文本?

转载 作者:太空宇宙 更新时间:2023-11-04 04:28:27 24 4
gpt4 key购买 nike

我有两个 div。包装器 div (divider_header) 是相对定位的,左侧有一个 float ,而它的子级 (divider_txt) 是绝对定位的。

<div class="divider_header">
<div class="divider_txt">Friend Requests</div>
</div>

我想知道如何在 divider_txt 包装器内将文本水平居中?

CSS(不起作用):

.divider_header {
display: table;
position: relative;
border-bottom: 1px solid #666;
padding: 1px 0;
width: 418px;
margin: 0 auto;
float: left;
}

.divider_txt {
display: table-cell;
text-align: center;
font-size: 13px;
font-family: "Open Sans Condensed", Arial, sans-serif !important;
vertical-align: middle;
position: absolute;
z-index: 2;
background-color: #121219;
}

最佳答案

所以 text-align: center 正在做你的工作,如果水平居中对齐文本是你唯一的问题: http://jsfiddle.net/Volker_E/5jv2Q/2/

以及您更新和简化的 CSS:

.divider_header {
/*display: table;*/
float: left;
position: relative;
width: 418px;
border-bottom: 1px solid #666;
padding: 1px 0;
}

.divider_txt {
background: #121219;
color: red;
font: 13px "Open Sans Condensed", Arial, sans-serif;
text-align: center;
}

关于html - 如何水平居中绝对文本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17799573/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com