CSS：在文本旁边有浮动元素的情况下，如何使文本居中？

基本上，我希望文本居中，忽略任何浮动的同级元素

起初，我认为这不会是一个问题，因为我的印象是浮动元素没有从任何同级元素的宽度中提取

（我希望红色文本位于蓝色框的中心，尽管有绿色文本）

---

如何最好地实现这一点？

这里有一个指向工作小提琴的链接：

（在您的示例中，您打开了一个

，然后用

将其关闭）

---

我给它一个div，并给它

margin:0px auto和宽度-似乎做了你做不到的事。如果它在父框中居中，则浮点将在某个点与内容重叠，这将破坏浮点的点。这里有两种方法可以使用。如果您知道浮动的宽度，则可以应用相等的负右边距。否则，您可以完全定位元素。
您可以保持原样，但只需在另一侧添加与浮动元素宽度相同像素值的填充

.parent{        
    text-align: center;
}
.centered.element{
     padding-left: [width of floating element]px;
}

.floating.element{
     float: left;
}

要轻松找到宽度，只需在任何现代浏览器中使用
开发工具
检查
元素即可

请看这里的小提琴：

注意：如果居中元素具有指定的
背景颜色，这可能不起作用。
但是如果没有固定的宽度？基本上，当您不知道其中一个元素（浮动元素或要居中的文本）的宽度时，就不能这样做。我现在遇到了这个问题，并在寻找解决方案，但运气不好。我有一个按钮和一个文本，都在同一个DIV中。我希望按钮向左对齐，文本位于父对象（DIV）的中心。我尝试了绝对定位按钮和文本对齐：在父div上居中，但当文本更大时，它将位于按钮后面：（我唯一能想到的另一个选择是制作一个大小相同的对象（例如，不可见的
div
）并将其浮动到父容器的另一侧（包含其他恼人的浮动）。这比使用边距来平衡居中要好，因为浮动对象即使不在与文本相同的容器中也会影响文本居中。想法？对我来说非常有用。我喜欢你的想法：否则，你可以绝对地像这样定位元素。是的，定位绝对内部相对只会trick@Slink你的巴拉ncing隐形潜水器的想法对我来说非常有效…如果你能回答的话，我会支持你的。