Use <pre> tag for formatting

app/assets/stylesheets/application.css

@@ -199,6 +199,10 @@ textarea:invalid {
   border-color: var(--color-red);
   outline-color: var(--color-red);
 }
+pre {
+  display: inline;
+  font: inherit;
+}
 
 /* `.button`: button-styled <a>, <button>, <input type=submit>.
  * `.link`: any other <a>.

app/models/application_record.rb

@@ -1,4 +1,6 @@
 class ApplicationRecord < ActiveRecord::Base
+  include ActionView::Helpers::TagHelper
+
   class << self
     # Cached attribute has non-user assignable value calculated from other
     # attributes' values on create/update. This simplifies and speeds up

app/models/quantity.rb

@@ -98,7 +98,7 @@ class Quantity < ApplicationRecord
   }
 
   def to_s
-    name
+    tag.pre name
   end
 
   def to_s_with_depth

app/models/unit.rb

@@ -91,7 +91,7 @@ class Unit < ApplicationRecord
   end
 
   def to_s
-    symbol
+    tag.pre symbol
   end
 
   def movable?

app/views/users/index.html.erb

@@ -4,7 +4,7 @@
       <th><%= User.human_attribute_name(:email) %></th>
       <th><%= User.human_attribute_name(:status) %></th>
       <th><%= User.human_attribute_name(:confirmed_at) %></th>
-      <th><%= User.human_attribute_name(:created_at) %>&nbsp;<sup>(UTC)</sup></th>
+      <th><pre><%= User.human_attribute_name(:created_at) %> <sup>(UTC)</sup></pre></th>
       <th><%= t :actions %></th>
     </tr>
   </thead>
@@ -23,7 +23,7 @@
           <% end %>
         </td>
         <td><%= svg_tag 'checkbox-marked-outline' if user.confirmed_at.present? %></td>
-        <td><%= l user.created_at, format: :without_tz %></td>
+        <td><pre><%= l user.created_at, format: :without_tz %></pre></td>
         <td class="flex">
           <% if allow_disguise?(user) %>
             <%= image_link_to t('.disguise'), 'incognito', disguise_user_path(user) %>