Home/ Questions/Q 5948853
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-22T17:10:03+00:00

I’m displaying some content using the PRE tag, because it’s vital to preserve the

  • 0

I’m displaying some content using the PRE tag, because it’s vital to preserve the whitespace as is.
However, when I’m trying to change the PRE font-family, the whitespace indentation falls apart.

To be more specific, I’m building a site with song chords and their equivalent lyrics, so I need each chord to be exactly above a certain word or letter. When I style the PRE font-family, the chords are losing their relative to the letters position, even though all text is styled the same way.

Any suggestions?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    As the other posters said, you need a monospace font. You can use CSS3 custom fonts if you want to use your own monospace font. The easiest way to fix your problem, though, is to let the viewer’s browser decide which font to use. To make sure all viewers see your pre content in a monospace font, use the following.

    pre { font-family: monospace; }
    • 0