为什么在使用 <>pre 或 white-space： pre 时更改字体仍然会撤消空格保留？

问：

我正在尝试在网页上放置一件 ASCII 艺术作品。ASCII 图像将是整个页面上的唯一元素，但是，我想使用 CSS 设置它的样式以匹配网站其余部分的设计（这是一个艺术项目）。 因为它是 ASCII，所以我在我的 HTML 中使用了预先包围它。我能够调整文本对齐以使图像居中而不会出现问题;我还可以将关键帧添加到我的预备课程中，或者引用另一个班级来为我的文本制作动画，而不会损坏格式。但是，当我尝试将字体更改为我网站其余部分使用的较浅的 Helvetica Neue 时，ASCII 的形状完全扭曲了。我什至调整了我的图像，使它成为一个包含的矩形，而不是被大量的空白框住;它仍然扭曲。我一直在用 css 空格调整兜圈子 2 小时，但无济于事。我做错了什么？

这是我目前的 css 情况，请记住 html 只是 ASCII 框架的正文，然后是 pre;

pre {
text-align: center;
}

.open {
font-family: Helvetica Neue;
font-weight: lighter;
white-space: pre;
}

预格式化非常好;添加我的 .open 类是 sht 出错的地方。 我可以添加关键帧之类的东西，但不会发生任何奇怪的事情。