Question

我正在创建HTML电子邮件签名，并且在电话等小型设备上，当屏幕分辨率不足以签名时，我无法阻止它。我尝试了我在这里找到的所有内容的组合，无论是关于类似问题的一个或多个建议，但似乎没有任何工作。

这是正确的sig和两个不正确的版本：

以下是我们目前的代码：

<div style="line-height:18px; margin:0px; padding: 0px 8px 8px 0px; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#1e394e; display:inline-block; white-space: nowrap; overflow: hidden; min-width:500px;">

Sonnie Parker 合作伙伴，高级管理员
334-482-4248 avnirvana.com

Answer 1

签名将始终换行，因为图像容器设置为float。如果您希望代码能够响应并在较小的设备上以不同方式显示，那么这很好。如果你想要两个一半并排，我会指定它们的宽度相对于它们的父。另外，我建议您使用div代码组织代码。

.parent {
  white-space: nowrap;
}

.parent>div {
  display: inline-block;
}

.left {
  width: 50%;
  padding-right: 7px;
  border-right: 2px solid #000000;
  box-sizing: border-box;
}

.left img {
  width: 100%;
}

.right {
  width: 50%;
  color: #1e394e;
  padding-left: 7px;
  box-sizing: border-box;
}

<div class="parent">
  <div class="left">
    <a href="avnirvana.com">
      <img src="https://www.avnirvana.com/images/email_logo.png">
    </a>
  </div>

  <div class="right">
    <div>
      <strong>Sonnie Parker</strong>
    </div>
    <div>
      <em>Partner, Senior Administrator</em>
    </div>
    <div>
      334-482-4248 <a href="avnirvana.com" ; style="color:#0f67b5 !important;">avnirvana.com</a>
    </div>
  </div>
</div>

用于HTML电子邮件签名的div style inline nowrap

1 个答案: