两个元素使用相同的精确样式，但颜色略有不同

Question

我觉得这里有一个独特的问题，我有两个管道（＆＃34; |＆＃34; s）风格完全相同，使用完全相同的类，但是有两种不同的颜色。这是标记：

<span class="block">&copy; <?php echo date(Y); ?> Apple Hill Farm </span>

<span class="block">and Country Club</span>

<span class="spaces">&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;</span>

<span class="block">
  <a href="http://www.inconcertweb.com/web" target="_blank">Website Design and Development</a>
</span> 

by <span class="block">
   <a href="http://www.blahblahblah.com" target="_blank">BlahBlah Web Solutions</a>
</span>

<span class="spaces">&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;</span>

<span class="block">
   <a href="<?php echo get_site_url(); ?>/site-map">Site Map</a>
</span>

我所谈论的元素是＆＃34;空格＆＃34;类元素。这是造型：

.spaces {
   color: #625a49;
}

（我试图直接设置文本样式，因为它之前没有工作）这里有一个快照：

很抱歉，如果背景很难看到。你可以看到，这两个管道略有不同。有没有人遇到过这个问题？

Answer 1

.spaces {
   background-color: #625a49;
   width: 1px;
   height: 14px;
   display: inline-block;
   vertical-align: middle;
   margin: 0 1em;
}

似乎问题只是根据窗口的大小/管道最终在屏幕上的颜色略有不同，因为我注意到随着屏幕调整大小，管道两种都切换回来在两种颜色之间。所以我用这段代码替换了管道，结果很好。