【问题标题】：Images don't display inline图像不显示内联
【发布时间】：2013-10-21 14:36:26
【问题描述】：

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

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;
}

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

【问题讨论】：

您必须减小图像的宽度以适应容器。
否则，你可以浮动你的内容

标签： html css image drupal inline

【解决方案1】：

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

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

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

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

【讨论】：

【解决方案2】：

如果您因为问题以外的其他原因不给 .loga div 样式内联块，只需将其删除。默认显示属性是块。他们已经内联了。但由于线宽，他们不得不下降到第二行。所以你所要做的就是通过给它一个 width:100% 或 width:500px 等来放大 .yoga...

【讨论】：

【解决方案3】：

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

【讨论】：

【解决方案4】：

图像默认显示属性 - inline-block。

img {
   display: inline-block; 
}

试试看：

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

【讨论】：