diff --git a/package.json b/package.json
index 3191e850..b65ed858 100644
--- a/package.json
+++ b/package.json
@@ -12,6 +12,7 @@
     "url": "https://github.com/jackyzha0/quartz.git"
   },
   "scripts": {
+    "docs": "npx quartz build --serve -d docs",
     "check": "tsc --noEmit && npx prettier . --check",
     "format": "npx prettier . --write",
     "test": "tsx ./quartz/util/path.test.ts",
diff --git a/quartz/components/pages/FolderContent.tsx b/quartz/components/pages/FolderContent.tsx
index 6c5fd7d2..dc076c4a 100644
--- a/quartz/components/pages/FolderContent.tsx
+++ b/quartz/components/pages/FolderContent.tsx
@@ -33,7 +33,9 @@ function FolderContent(props: QuartzComponentProps) {
 
   return (
     <div class="popover-hint">
-      <article>{content}</article>
+      <article>
+        <p>{content}</p>
+      </article>
       <p>{allPagesInFolder.length} items under this folder.</p>
       <div>
         <PageList {...listProps} />
diff --git a/quartz/components/pages/TagContent.tsx b/quartz/components/pages/TagContent.tsx
index 73ee465c..fb72e284 100644
--- a/quartz/components/pages/TagContent.tsx
+++ b/quartz/components/pages/TagContent.tsx
@@ -37,7 +37,9 @@ function TagContent(props: QuartzComponentProps) {
 
     return (
       <div class="popover-hint">
-        <article>{content}</article>
+        <article>
+          <p>{content}</p>
+        </article>
         <p>Found {tags.length} total tags.</p>
         <div>
           {tags.map((tag) => {
diff --git a/quartz/components/styles/popover.scss b/quartz/components/styles/popover.scss
index 21e6b722..fae0e121 100644
--- a/quartz/components/styles/popover.scss
+++ b/quartz/components/styles/popover.scss
@@ -34,6 +34,7 @@
     border-radius: 5px;
     box-shadow: 6px 6px 36px 0 rgba(0, 0, 0, 0.25);
     overflow: auto;
+    white-space: normal;
   }
 
   h1 {