如何删除CSS中元素最后一个字母的字母间距？

这是我的HTML页面中有问题的图片。 文本菜单位于右对齐的div内，字母间距为1.2米。 是否有用于此的伪选择器？我不想求助于相对定位

我希望文本菜单在块结束的地方结束

我已经标记了一个最佳答案，但代码块要求我提供标记。给你

<div class="sidebar">
        <span class="menuheader">MENU</span>
        <ul>
        <li><a href="#content">Content</a></li>
        <li><a href="#attachments">Attachments</a></li>
        <li><a href="#subpages">Sub-pages</a></li>
        <li><a href="#newsubpage">New sub-page</a></li>
        </a></ul>
</div>

.sidebar{
color: rgb(150,93,101);
display: inline;
line-height: 1.3em;
position: absolute;
top: 138px;
width: 218px;
}

.menuheader{
letter-spacing: 1.1em;
margin: -1.2em;
text-align: right;
}

菜单






.侧边栏{
颜色：rgb（150,93101）；
显示：内联；
线高：1.3em；
位置：绝对位置；
顶部：138px；
宽度：218px；
}
梅努海德先生{
字母间距：1.1米；
保证金：-1.2米；
文本对齐：右对齐；
}

您可以将元素的右边距设置为-1.2em，这将抵消字母间距

e、 g

为了回答您关于伪选择器的问题，据我所知，没有每个字符的伪选择器。（编辑：划掉它，这是Jonas G.Drange指出的

：第一个字母

选择器）

---

编辑：您可以在这里找到一个基本示例：

您不能以最后一个字符为目标，只能以第一个字符为目标（CSS3，：

第一个字母

）。您可以在最后一个字母周围添加一个span，但这意味着添加无意义的标记，这比向元素添加定位“更糟糕”

---

CSS非常适合这样的诡计：）

事实上，我称之为浏览器bug。上面说是字符之间的间距，而你的浏览器（和我的浏览器）似乎在更改字符后的间距。您应该提交一份bug报告。

显然这是一个非常古老的问题，但您的特定示例所涉及的CSS在当时起到了作用

它包括将方向重置为相反方向，为内联元素提供格式化上下文，并将负文本缩进设置为等于字母间距

演示如下：

。侧栏{
颜色：rgb（150、93、101）；
线高：1.3em；
宽度：218px；
边框：实心；
文本对齐：右对齐；
}
梅努海德先生{
字母间距：1.1米；
方向：rtl；
显示：内联块；
文本缩进：-1.1米；
背景：黄金
}

菜单






无需将显示更改为任何其他类型（
段落示例），也无需对我的代码执行任何不必要的操作。文本缩进设置为负的字母间距值可以解决这个问题

文本缩进：-2em的工作方式完全符合我对
字母间距：2米的要求和是我必须添加到CSS中的唯一内容。
您可以尝试在文本中添加display:block，然后使用100%减去字母间距来减小宽度


.menuheader{
文本对齐：右对齐；
显示：块；
字母间距：1.1米；
宽度：钙（100%-1.1米）；
}
您可以在元素的后面添加一个：并将负边距设置为与字母间距相等

.menuheader {
  letter-spacing: 1.1em;
}
    
.menuheader:after {
   content:" ";
   margin-left:  -1.1em;
}

在Chrome、Firefox和Edge上测试
我使用的是Opera11.50。最新版本。我喜欢在Opera中分割纯css设计，因为Firefox渲染得太完美了，IE9可能有一些怪癖。这就是为什么你必须提交一份bug报告。如果它是一个旧版本，我会告诉你先更新。我不认为提交错误报告是一个好主意，因为IE/FF/WK/OP都必须实现这个怪癖。另外，如果这个bug被修复，我认为它会对其他网站的设计产生负面影响。也许你在想，如果你实施一个变通方法，然后bug得到修复，你自己的网站会受到怎样的影响。但是要小心：这种推理让我们多年来一直坚持使用IE6。似乎已经有一段时间了（但它可能会通过完整的css3实现得到修复）：嗯，
：第一个字母
从CSS1开始就存在。需要查看您的标记。我已经用标记更新了我的问题。
：第一个字母
伪元素并不完全正确“每个字符”也可以（否则它将被称为
：第一个字符
）。请参阅，在想要进行文本装饰时，最后出现了这个选项：下划线…在这种情况下，它不起作用。有什么线索吗？这个解决方案是一个很好的解决方案，但如果您想使
文本对齐：居中
另一个基于此想法的选项是将
左边距
设置为.5*
字母间距
（
.6em
在上面的例子中）和
右边距
到-.5*
字母间距
（
-.6em
在上面的例子中——注意
右边距
是一个负值）。对不起，我在上面的评论末尾键入了：应该是“注意
右边距
是一个负值”（我差几秒钟就错过了五分钟的编辑窗口）。这对这个案例很有效，但是当你有
文本装饰：下划线；
空间仍然存在时。这是我见过的最具巫毒色彩的CSS黑客，实际上很有效。非常聪明。
.menuheader {
  letter-spacing: 1.1em;
}
    
.menuheader:after {
   content:" ";
   margin-left:  -1.1em;
}