diff --git a/styles.css b/styles.css
index 5a79d02..b854a97 100644
--- a/styles.css
+++ b/styles.css
@@ -101,6 +101,8 @@ mjx-container {
 	overflow-x: auto;
 }
 
+p.metadata { margin: 0 }
+
 @media (max-width: 80em) {
   /* CSS that should be displayed if width is equal to or less than 60em goes here */
 	#contentWrapper { flex-direction: column }
diff --git a/templates/article.html b/templates/article.html
index fa23afe..f996432 100644
--- a/templates/article.html
+++ b/templates/article.html
@@ -18,22 +18,22 @@
 <body>
 	<div id="contentWrapper">
 		<div id="content">
-		<p class="smallText">
+		<p class="smallText metadata">
 			<a href="/permalink?uuid=$uuid$">permalink</a> (uuid: $uuid$)
 		</p>
-		<p class="smallText"> tags: [
+		<p class="smallText metadata"> tags: [
 			$for(tags)$
 			<a href="/.tags/$tags$.html">$tags$</a>$sep$,
 			$endfor$
 		]</p>
-		<p class="smallText">
+		<p class="smallText metadata">
 			written by $for(author)$$author$$sep$, $endfor$
 		</p>
-		<p class="smallText">
+		<p class="smallText metadata">
 			syntax highlighting based on <a href="https://pygments.org/">Pygments'</a> default
 			colors
 		</p>
-		<p class="smallText">
+		<p class="smallText metadata">
 			page generated by <a href="https://git.alv.cx/alvierahman90/notes2web">notes2web</a>
 		</p>
 		<details id="commitLog">
