Question

我正在处理这段代码，它在右侧略微按钮上显示标题。我无法弄清楚填充中是否存在错误？代码：

<p style="margin:0;font-family:'montreal-mediumregular', 'Lucida Grande', 'Lucida Sans Unicode', Tahoma, 'Sans-Serif';color:rgb(70,82,118);font-size:18px;line-height:25px;padding:15px 0 0 0;text-align:center;">
          <br><a href="https://www.orderin.co.za/" style="color:#d3392c;font-size:18px;text-align:center;background:rgb(255,255,255);padding:10px;border:1px solid #d3392c;width:205px;margin:20px auto 20px;font-family:'montreal-demiboldregular', 'Lucida Grande', 'Lucida Sans Unicode', Tahoma, 'Sans-Serif';letter-spacing:2px;text-decoration:none;">
             ORDERIN NOW
        </a>
        <br>
        <br>
      </p>

显示如下（截图中）：

you can see it's slightly off-centre towards the right

Answer 1

这应该呈现没有任何奇怪间距的按钮：

<p style="margin:0;font-family:'montreal-mediumregular', 'Lucida Grande', 'Lucida Sans Unicode', Tahoma, 'Sans-Serif';color:rgb(70,82,118);font-size:18px;line-height:25px;padding:15px 0 0 0;text-align:center;">
  <br>
  <a href="https://www.orderin.co.za/" style="color:#d3392c;font-size:18px;text-align:center;background:rgb(255,255,255);padding:10px;border:1px solid #d3392c;width:205px;margin:20px auto 20px;font-family:'montreal-demiboldregular', 'Lucida Grande', 'Lucida Sans Unicode', Tahoma, 'Sans-Serif';letter-spacing:2px;text-decoration:none;">ORDERIN NOW</a>
  <br>
  <br>
</p>

标记之间的文本（例如，a标记）不应在任何一端包含尾随空格。浏览器处理它的方式不同。在我的机器上，Firefox将它全部剥离，而Safari和Chrome条带处于领先地位，但保留一个尾随空格。

当我第一次粘贴你的代码时，我得到一个可见的“A with a circumflex”字符（0xc382），我无法复制。现在当我复制/粘贴您的代码时，我在右侧上获得了一个空格（与您的图像在左侧上显示一个空格）。

无论哪种方式，上面更正的HTML都应该正常渲染（在运行High Sierra的MBP上使用Chrome / Firefox / Safari进行测试）。

试图将标题置于按钮上，但它仍然偏离中心

1 个答案: