1

In most fonts, the hash symbol has a slight rightwards slant. I however, am looking to display this hash symbol in a straight way, somewhat how it's displayed here as code: #. I could of course put it into a <span class='hash-font'>#</span> that renders it straight, but I was thinking that maybe there was a cleaner way of achieving what I want, e.g through a font-feature-settings property?

  • Not as far as I am *aware*, though it might depend on your chosen font. Have a play around with the settings available at https://css-tricks.com/almanac/properties/f/font-feature-settings/. – Obsidian Age Apr 14 '22 at 02:36
  • @ObsidianAge seems like there is nothing that straightens the hash symbol... I'll probably have to stick to `font-size-adjust` and a special font embedded through a ``. Thanks anyways though. – user18799004 Apr 14 '22 at 03:41
  • You could edit the font file itself. You'd just be skewing the thing in Illustrator until the lines are 0°. If you're getting it via CDN, you'll have to extract the one character from the file and save it separately, to then use it as your first `font-family`. Another, less clean, way would be using CSS transforms. Just blow up the character in the browser and `skew()` until a screenshot of it shows a perfect straight line. Another option would be to just create something with SVG or CSS. Remember to keep the HTML character in there, though. If you want help with one of these, let me know. – Gust van de Wal Oct 12 '22 at 12:16

0 Answers0