diff --git a/InteractiveHtmlBom/web/ibom.css b/InteractiveHtmlBom/web/ibom.css
index d3f16c3..cbd0e38 100644
--- a/InteractiveHtmlBom/web/ibom.css
+++ b/InteractiveHtmlBom/web/ibom.css
@@ -168,10 +168,22 @@ canvas:active {
 }
 
 .fileinfo {
+  display: block;
   width: 100%;
-  max-width: 1000px;
   border: none;
-  padding: 3px;
+  padding: 6px;
+  box-sizing: border-box;
+}
+
+.fileinfo tbody {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  gap: 0.2rem 2rem;
+}
+
+.fileinfo tr {
+  display: contents;
 }
 
 .fileinfo .title {
@@ -180,13 +192,30 @@ canvas:active {
 }
 
 .fileinfo td {
+  display: block;
+  /* Wrap at a usable column width, independently of the metadata text length. */
+  flex: 1 1 16rem;
+  min-width: 0;
+  max-width: 100%;
+  padding: 0;
+}
+
+.fileinfo .metadata-field {
   overflow: hidden;
   white-space: nowrap;
-  max-width: 1px;
-  width: 50%;
   text-overflow: ellipsis;
 }
 
+.fileinfo [hidden] {
+  display: none;
+}
+
+@container (max-width: 52rem) {
+  .fileinfo .title {
+    font-size: 18pt;
+  }
+}
+
 .bom {
   border-collapse: collapse;
   font-family: Consolas, "DejaVu Sans Mono", Monaco, monospace;
@@ -616,7 +645,7 @@ mark.highlight {
 #top {
   display: flex;
   flex-wrap: wrap;
-  justify-content: flex-end;
+  justify-content: center;
   align-items: center;
 }
 
@@ -662,6 +691,7 @@ mark.highlight {
 #fileinfodiv {
   flex: 20rem 1 0;
   overflow: auto;
+  container-type: inline-size;
 }
 
 #bomcontrols {
diff --git a/InteractiveHtmlBom/web/ibom.html b/InteractiveHtmlBom/web/ibom.html
index 69fd777..a6e5a6d 100644
--- a/InteractiveHtmlBom/web/ibom.html
+++ b/InteractiveHtmlBom/web/ibom.html
@@ -60,20 +60,15 @@
       <table class="fileinfo">
         <tbody>
           <tr>
-            <td id="title" class="title" style="width: 70%">
-              Title
+            <td id="board-info">
+              <div id="title" class="title metadata-field">Title</div>
+              <div id="company" class="metadata-field">Company</div>
             </td>
-            <td id="revision" class="title" style="width: 30%">
-              Revision
-            </td>
-          </tr>
-          <tr>
-            <td id="company">
-              Company
-            </td>
-            <td id="filedate">
-              Date
+            <td id="revision-info">
+              <div id="revision" class="title metadata-field">Revision</div>
+              <div id="filedate" class="metadata-field">Date</div>
             </td>
+            <td id="variant" class="title metadata-field" hidden></td>
           </tr>
         </tbody>
       </table>
diff --git a/InteractiveHtmlBom/web/ibom.js b/InteractiveHtmlBom/web/ibom.js
index d628d98..9173095 100644
--- a/InteractiveHtmlBom/web/ibom.js
+++ b/InteractiveHtmlBom/web/ibom.js
@@ -896,6 +896,22 @@ function populateMetadata() {
   document.getElementById("revision").innerHTML = "Rev: " + pcbdata.metadata.revision;
   document.getElementById("company").innerHTML = pcbdata.metadata.company;
   document.getElementById("filedate").innerHTML = pcbdata.metadata.date;
+  ["title", "revision", "company", "date"].forEach(function(field) {
+    var element = document.getElementById(field === "date" ? "filedate" : field);
+    var value = pcbdata.metadata[field];
+    element.hidden = typeof value !== "string" || value.trim() === "";
+    element.title = element.textContent;
+  });
+  document.getElementById("board-info").hidden =
+      document.getElementById("title").hidden && document.getElementById("company").hidden;
+  document.getElementById("revision-info").hidden =
+      document.getElementById("revision").hidden && document.getElementById("filedate").hidden;
+  var variant = pcbdata.metadata.variant;
+  var variantElement = document.getElementById("variant");
+  var hasVariant = typeof variant === "string" && variant.trim() !== "";
+  variantElement.textContent = hasVariant ? "Variant: " + variant : "";
+  variantElement.title = variantElement.textContent;
+  variantElement.hidden = !hasVariant;
   if (pcbdata.metadata.title != "") {
     document.title = pcbdata.metadata.title + " BOM";
   }