图像不显示内联

Question

我的问题是我希望以内联方式显示的图像以列表形式显示。我不知道我做错了什么，因为在我看来一切都是正确的。

的HTML

<div class="loga">
<img style="display:inline;" src="photos/logoWUT_czarne.PNG" width="370" height="135">
<img style="display:inline;" src="photos/bosch_logo_gray.png" height="115" width="380" >
<img style="display:inline;" src="photos/general-electric-logo-png_gray.png" height="115" width="115" >
</div>

CSS

.loga {
    display: inline-block;
}

我的代码一定有问题，因为它在任何浏览器中都不起作用。

Answer 1

body或任何父标记或浏览器窗口的宽度是否足够？ 你可能想要这个，

http://i.imgur.com/fSrShkT.png

但是如果没有足够的宽度，它可以像这样显示

http://i.imgur.com/Fdx6jgS.png

Answer 2

如果由于问题之外的其他原因没有给.loga div提供样式内联块，只需将其删除即可。默认显示属性是block。 它们已经是内联的。但由于线宽，它们必须下降到第二行。所以你要做的就是扩大.yoga的宽度：100％或宽度：500px等......

Answer 3

事实证明，即使在“完整HTML”模式下，在行的每一端添加<br>标记也是一个Drupal“功能”。要禁用它，您必须转到管理员＆gt;配置＆gt;输入格式，选择“完整HTML”右侧的“配置”，并取消选中标记为“换行符转换器”的复选框。现在一切正常。

Answer 4

图片默认显示属性 - 内嵌块。

img {
   display: inline-block; 
}

试一试：

.loga {
    display: block;
    width: 900 px;
}