Bootstrap 3 - 图像周围的文本对齐，同时保持图像响应

【问题标题】：Bootstrap 3 - Text alignment around an image while keeping image as responsiveBootstrap 3 - 图像周围的文本对齐，同时保持图像响应
【发布时间】：2014-01-30 06:48:53
【问题描述】：

我的图片周围有文字 - bootply。当img-thumbnail 样式应用于图像时，文本显示在右侧，但当img-rounded 或未应用样式时，文本显示在底部。

帮助在img-rounded 或未应用样式时向右显示文本，保持img-responsive 样式。正如Mozilla Developer Network 所建议的那样，我尝试使用vertical-align，但它不起作用。

为清楚起见，请提供代码帮助。非常感谢！

【问题讨论】：

投了反对票的人，可能没看到我提到的：保持img-responsive风格。
在看到上面的评论后，一位反对的选民已经取消了，谢谢你。其他人，如果你能解释是什么让你投了反对票，如果我觉得你的回答很有价值，我会确保我将来纠正自己。如果我不同意你的观点，我不会争论，但你的回应将帮助我理解你的决定。提前致谢。

标签： css image twitter-bootstrap-3 text-align

【解决方案1】：

我希望这个解决方案会有所帮助（也许不是完美的），但我认为它对你有用，在img-rounded 时向右显示文本，只需通过将 display 的值设置为 inline-block 而不是块来覆盖此类属性。

代码： 在 img-rounded 类中将 display: block; 更改为 display: inline-block;。

然后你可以用一个 div 包裹这个部分（图像 + 段落）来自定义两者的外观。

【讨论】：

我接受你的回答，因为它给了我一个提示。实际上，IMG 是一个内联元素，img-rounded 不会覆盖 display 样式。它是img-responsive，它声明display: block;，这在响应式设备中是有意义的。出于明显的原因，我无法覆盖它，所以我已将 img-rounded 设为内联，正如您所建议的那样。再次感谢！