小编Sli*_*ink的帖子

使用CSS,可以很容易地使用文本在容器中水平居中text-align:center;,但如果该文本的任何单个单词大于容器的宽度,浏览器会自动"剪辑"到容器的左边界(如, -sized word与太小容器的左侧对齐,如果没有CSS word-break:hyphenate;属性设置(或类似),超大字会突出容器的右边缘.

有什么方法可以将这张照片留在我的文字左边以节省垂直空间？那好吧.无论如何...

如果不使用子容器元素来保存文本,是否有办法将超大字体居中,以便它同样悬挂在容器的左右两侧？

同样,我不想在容器中使用文本容器.我可以通过使用<div>text to be centered</div>具有固定width和负数的子项margin-left,或者absolute在a中定位容器元素,在5秒内完成此操作relative div,但我正在寻找一个CSS属性,即使单词太长而无法适应宽度,也会使文本居中.默认情况下,text-align:center不执行此操作.

思考？谢谢!-Slink

我只是想知道是否有一些像这样的JS简写:

if (x != 1 && x != 2) do stuff;

这样的野兽存在吗？相反,我想说这样的话:

if (x != 1:2) do stuff;

在所有主流浏览器中:正如问题所述,父<div>容器(其高度未设置)超出其高度以适合子<img>元素(例如,300像素高的图像是其中唯一的内容div).尺寸过大通常约为3到5个像素,并且首先出现,因为img margin-bottom或div padding-bottom可能看起来像.

但是,使用绝对定位,可以清楚地证明底部div位于底部下方img几个像素.它可能不会破坏网站的设计,但在某些情况下克服这个障碍.我在这里做了一个相当详细的小提示,展示了这个问题.

• 为什么这种标准做法适用于网络浏览器？
• 这是为了补偿某些东西吗？这似乎没必要.
• 这是一个错误,还是即将过时的功能？

编辑:感谢下面的回答/评论员,我知道原因是<img>默认情况下将a视为CSS display:inline,它保留了元素周围的空白.display:block通过消除元素周围的空白来更改它以完全解决问题.

注意:可以通过为image子元素赋予float:left或者float:right等的CSS属性来避免这种过大的规模,但这是一种解决方法,因此不是问题的答案.这可能有问题的一个原因是,如果你已经float在div子图像前面分层了其他元素(浮动重叠不允许Firefox,Opera,IE.float仅在Chrome和Safari中使用CSS position设置允许重叠).谢谢!