如何修复Android Chrome/Firefox中的等宽空间宽度不正确？
如何修复Android Chrome/Firefox中的等宽空间宽度不正确？
提问于 2018-08-17 17:24:46
我在玩一个网站，它显示了一个ASCII/ANSI艺术标志，一切似乎在桌面浏览器中都运行得很好。
然后我想看看它是否能在移动设备上工作，但这里似乎空白的宽度是错误的。网站中显示ASCII-art的部分被包装在一个<div>中，其中包含以下CSS属性：
line-height:1em;
color: #ff791a;
white-space: pre !important;
font-size: 0.7vw;
margin: 20% 50% 0 0;
font-family: 'Druid San Mono',courier, monospace, monospace;
width: 100%;
height: 100px;我尝试了几种不同的字体，如"Druid Sans Mono"，monospace (也叫monospace，monospace )，"Courier“和"Roboto Mono”，但都不起作用。
我还尝试使用nbsp，而不仅仅是空格。改变字母间距似乎也没有我想要的效果。
有什么窍门可以让它工作吗？
您可以在此处查看站点disconnected.tech
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-10-09 10:10:50
原来some gliphs are missing是谷歌字体的。
一个变通方法是Adobe的Source Code Pro，它包含所有字符(包括我需要的框图)。Mononoki也应该可以工作。
我包括直接从奥多比，而不是通过谷歌字体：https://adobe-fonts.github.io/source-code-pro/source-code-pro.css
它可能会告诉谷歌字体包括所有必要的字符在他们的精简源代码专业版(text=参数)。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51892280
复制相关文章
相似问题