2 zhaopeng9999 zhaopeng9999 于 2017.09.03 17:50 提问

文本水平对齐text-align:center;怎不不管用呀?

![图片说明](https://img-ask.csdn.net/upload/201709/03/1504432163_104775.png)图片说明

9个回答

ShewMi
ShewMi   2017.09.03 17:59

不知道你的css是如何定义的,通常是由于上级或父级元素用了浮动或者相对定位造成text align无效,还有一个是css生效的优先级。

qq_29594393
qq_29594393   Ds   Rxr 2017.09.03 19:38

看这个作用不大,你进入页面,审查元素,看具体渲染的属性.

lushanyanYX
lushanyanYX   2017.09.03 20:05

打开chrome调试看盒模型,你就会发现字体本身是在盒模型中居中了,但是他的所在的盒模型(items)不是居中的,所以最后的结果不是居中的。
解决方面比较优雅的就是item的宽度为继承,等于父元素宽度,或者使item居中。

zhaopeng9999
zhaopeng9999   2017.09.03 17:52

代码这么些不管用

qq_25260079
qq_25260079   2017.09.03 19:46

貌似要设置text-height

xionglangs
xionglangs   Rxr 2017.09.03 19:55

图片说明
图片说明
把你的布局贴出来,在用f12看看是不是这个属性没生效。

as3168225
as3168225   2017.09.03 23:45

于上级或父级元素用了浮动或者相对定位造成text align无效,还有一个是css生效的优先级。

czp555
czp555   2017.09.04 09:07

样式问题不对肯定是有其他样式影响了,打开F12,将作用在该元素的样式一个个取消看看,然后观察是什么影响到了元素居中,能外可是设置下元素的优先级
text-align:center !important;

sunny_desmond
sunny_desmond   Rxr 2017.09.06 22:05

如果你用的span,a,em类似这种的行内元素的话,直接设置text-align:center貌似是没有用的,你需要给这种元素加上display:block哦~或者用display:flex; justiy-content:center

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
简单理解css中的垂直居中和水平居中,即vertical-align和text-align属性
如何实现父元素内部元素的垂直居中与水平居中,vertical-align和text-align的简单实用方法
CSS文本对齐text-align详解
1.语法  text-align具体参数如下: 语法:text-align : left | right | center | justify  说明:设定元素内文本的水平对齐方式。  参数:left : 左对齐;right : 右对齐;center :  居中;justify :  两端对齐  初始值:跟浏览器的设置有关  继承性:可继承  适用于:block元素
Layer text-align:center
body { text-align:center; }#wrap { text-align:left; margin:0 auto;}
css3总结之: text-align: justify (两端对齐)
text-align: justify:   大家都知道 text-align 属性是规定元素中的文本的水平对齐方式,最常用的值是left、right、center,那么justify是什么呢?     在W3C上是这样介绍的:     justify 可以使文本的两端都对齐在两端对齐文本中,文本行的左右两端都放在父元素的内边界上。然后,调整单词和字母间的间隔,使各行的
水平居中的几种方法-margin,text-align
水平居中的几种方法-margin,text-align在对元素进行水平居中时,可能会有多种方法,但不同的居中方法的适用场景也可能是不相同的。margin设置为auto来水平居中我们知道,在普通流的块级元素中,元素的七个水平属性相加的和等于包含块的width值,利用这个属性,将margin-left,和margin-width两个值设置为auto,它们会被剩下的值均分,设置为相同的长度(注意width
IE支持text-align:center,而在FireFox无效问题
解决方法: 同时写入如下代码即可   text-align: -moz-center !important;    /* Firefox*/   text-align: center;                              /*IE*/
关于text-align:center的浏览器兼容问题
最近在做页面的时候,发现text-align:center在有些浏览器下并没有成功发挥作用,这才发现原来text-align:center也存在浏览器兼容性问题。
absolute元素在text-align属性下的对齐显示
css
dl里的内容无法居中的原因和解决办法
先说无法居中的原因:dl-dt-dd是标题+列表类标签,dt和dd里的内容默认一定会缩进,导致dl-dt-dd中的text-align无效。解决办法: 1. 去掉默认样式*{ margin: 0; padding: 0; }一定要先记得清掉默认样式啊!!很多奇怪的问题就迎刃而解了。以下是未清除默认样式的解决方法: 1. 用margin调整dd或者dt。 3. 改用ul-li标签
text-align: center;的兼容性
今天发现text-align: center;">我是要显示的文字这句话在一般浏览器中是没有任何问题的,就是在iPhone手机浏览器中显示异常,不居中也就算了,文字稍微多点还会自动换行(还不到所在div的一半就换行),查了好多兼容方式都没用,其中包括w3school上面的例子也看了,也没得到什么有用的信息。首先想到以前百度编辑器中的一个问题,就是自动换行问题,就把属性word-break:keep