强制图片不换行

Question

我不能改变HTML主题，但我可以访问CSS文件。

<div class="photos">
    <img src="a.jpg" alt="" align="left" /> 
    <img src="b.jpg" alt="" align="left" />
    <img src="c.jpg" alt="" align="left" />  //align makes the images wrap
</div>

很不幸，我无法从图像中删除align="left"属性，否则这个CSS代码片段就可以完成任务了。

.photos{
    white-space: nowrap;
}
.photos img{
    display: inline;
    vertical-align: top;
}

有什么想法吗？是否可能只使用CSS而不是表格的强制力使这些图像水平对齐？
提前感谢！

- Mohammad

Answer 1

尝试使用 float: none; ：

.photos img{
  display: inline;
  vertical-align: top;
  float: none;
}

- Gert Grenander

---

没问题，穆罕默德。我很高兴能帮助到你。 :) - Gert Grenander

Answer 2

试试这个：

.photos img{
    display: inline;
    vertical-align: top;
    clear: both; // clears the floating
}

您可以在W3Schools上了解更多关于CSS clear属性的信息。

编辑
抱歉我误读了您的意思。我以为您想要将它们堆叠起来。您选择使用float: none或clear: right都是正确的，这也会取消浮动。我可能会同时使用两者，以确保IE不会出现奇怪的CSS假设！ ;)

- Frankie