如何将文本和图像置于％宽度div内的一行上？

Question

我真的很挣扎，我不知道为什么。我希望在1行上有文本和图像，并在100％宽度div内居中。这是一个jsfiddle ..

http://jsfiddle.net/JnbeJ/

Answer 1

浮动元素自动变为块级。通过text-align: center将它们置于中心位置是不可能的。你要做的唯一方法是使它们成为内联块：display: inline-block。我添加了vertical-align: top; h作为顶部。工作示例如下：http://jsfiddle.net/skip405/JnbeJ/4/

Answer 2

您的图片和文字无法向左浮动并同时居中......

Answer 3

你有一个100％宽度的div（btw / divs是100％开头），并尝试将div内部居中，也是100％宽度。您可以在内部div上放置宽度，也可以将其设为inline-block。

Updated fiddle.

Answer 4

你正在使用一个类名为“居中”的包装器，所以不要同时创建两个元素（display：inline-block;），只需添加它来设置包装器的样式：

.centered {display: inline-block; margin: 0 auto;}

你的容器css中还有一个额外的（text-align：center;），不需要在那里。