0

When I open the following HTML document in Chrome …

<html>
<head>

<style>
  p { font-family: monospace }
</style>
 
</head>
<body>

  <p>mmmmmmm</p>
  <p>iiiiiii</p>

</body>

… it is rendered like so

enter image description here

My understanding is that text with font-family: monospace should be rendered in a non-proportional font.

When I search for monospaced fonts on my system, I find some that I have installed:

$ fc-list :spacing=mono
/usr/share/fonts/truetype/liberation/LiberationMono-BoldItalic.ttf: Liberation Mono:style=Bold Italic
/usr/share/fonts/truetype/liberation/LiberationMono-Bold.ttf: Liberation Mono:style=Bold
/usr/share/fonts/truetype/liberation/LiberationMono-Regular.ttf: Liberation Mono:style=Regular
/usr/share/fonts/truetype/liberation/LiberationMono-Italic.ttf: Liberation Mono:style=Italic

Update: When I check the developer tools's element tab, I find the following information:

enter image description here

6
  • What happens when you try: font-family: monospace, monospace;
    – Steve
    May 25 at 21:14
  • @Steve, this doesn't have any noticeable effect. May 25 at 21:51
  • 1
    In Chrome, click on the three dots at upper right, go to More tools, Developer tools, and check the Elements tab. See the Styles panel at right to see exactly what font is being displayed.
    – Steve
    May 25 at 22:01
  • The font being displayed is monospace (see updated question). May 26 at 6:40
  • Try this. Put this in the head: <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    – Steve
    May 26 at 17:42

1 Answer 1

2

I've finally found the following setting in Chrome which allows to specfiy a font for Fixed-width font. This setting was set to Monospace. After changing it to Liberation Mono, the monospaced fonts are also displayed "correctly".

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.