1

我目前正在构建一个电子邮件模板。该模板包含彼此相邻排列的 USP。这是我正在使用的代码:

<td width="100%">
  <span style="white-space: nowrap;">
    <img src="checkmark.png" />&nbsp;&nbsp;[text name="USP1"]
  </span>
  &nbsp;&nbsp;&nbsp;&nbsp;
  <span style="white-space: nowrap;">
    <img src="checkmark.png" />&nbsp;&nbsp;[text name="USP2"]
  </span>
  &nbsp;&nbsp;&nbsp;&nbsp;
  <span style="white-space: nowrap;">
    <img src="checkmark.png" />&nbsp;&nbsp;[text name="USP3"]
  </span>
</td>

使用“nowrap”,我试图在智能手机上将 USP 放在彼此下方。太糟糕了,USP 都站在一起,这让桌子更宽了。

是否有一个简单的内联 CSS 技巧可以让它们在小屏幕上相互站立?

4

1 回答 1

2

HTML:

<td class="usps">
  <span>...
</td>

CSS:

table tr td.usps span {
  display: block;
}
于 2015-12-02T15:52:03.243 回答