diff --git a/layouts/partials/archive.html b/layouts/partials/archive.html
index 2569aeb..0bd5bfb 100644
--- a/layouts/partials/archive.html
+++ b/layouts/partials/archive.html
@@ -13,14 +13,16 @@
 
 {{- if eq .Kind "taxonomy" }}
   {{- if eq .Title "Tags" }}
+    <div class="tagsArchive">
     {{- range $key, $value := .Site.Taxonomies }}
       {{- $slicedTags := ($value.ByCount) }}
       {{- range $slicedTags }}
         {{- if eq $key "tags"}}
-          [<a href='/{{ $key }}/{{ (replace .Name "#" "%23") | urlize }}/' title="{{ .Name }}">{{ .Name }}</a><sup>{{ .Count }}</sup>]
+          <div><a href='/{{ $key }}/{{ (replace .Name "#" "%23") | urlize }}/' title="{{ .Name }}">{{ .Name }}</a><sup>{{ .Count }}</sup></div>
         {{- end }}
       {{- end }}
     {{- end }}
+  </div>
   {{- else }}
     {{- range .Pages }}
       <a href="{{ .Permalink }}">{{ .Title | markdownify }}</a><br>
diff --git a/static/css/custom.css b/static/css/custom.css
index 86e0365..622a273 100644
--- a/static/css/custom.css
+++ b/static/css/custom.css
@@ -253,4 +253,20 @@ form button {
   border: none;
   background-color: var(--off-bg);
   color: var(--link);
+}
+
+/* tags list styling */
+.tagsArchive {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
+  grid-gap: 0.5rem;
+  /* justify-content: center; */
+  margin: 0.5rem 0;
+
+}
+
+.tagsArchive sup {
+  font-size: 0.75rem;
+  margin-left: 0.2rem;
+  margin-right: 0.5rem;
 }
\ No newline at end of file