diff --git a/layouts/shortcodes/officehours.html b/layouts/shortcodes/officehours.html
index e5674a230c55cb8d50df5960fcba8857b7fb2c83..14f5c01aca5e1edce9d6aee72d42d82834d3b504 100644
--- a/layouts/shortcodes/officehours.html
+++ b/layouts/shortcodes/officehours.html
@@ -2,8 +2,8 @@
     <thead>
         <tr>
             <th>{{ i18n "weekday" }}</th>
-            <th>{{ i18n "date" }}</th>
-            <th>{{ i18n "time" }}</th>
+            <th class="right">{{ i18n "date" }}</th>
+            <th class="right">{{ i18n "time" }}</th>
         </tr>
     </thead>
     <tbody>
@@ -20,7 +20,7 @@
             {{ else }}
                 {{ dateFormat "January 2, 2006" (int .start) }}
             {{ end }}</td>
-            <td>{{ dateFormat "15:04" (int .start) }} – {{ dateFormat "15:04" (int .end) }}</td>
+            <td class="right">{{ dateFormat "15:04" (int .start) }} – {{ dateFormat "15:04" (int .end) }}</td>
         </tr>
     {{ end }}
     </tbody>
diff --git a/static/css/main.css b/static/css/main.css
index 02535230fe76623d699d5ace2f220b4cd4c96285..bee834666f025a61f62cac21b1797933d213514f 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -580,24 +580,26 @@ table {
     margin-top: 1.5rem;
     border-spacing: 0px;
     border-collapse: collapse;
+    width: 100%;
 }
 table td,
 table th {
-    padding: 0;
     line-height: 33px;
+    padding: .3em 1em;
+    vertical-align: top;
 }
 
 table th {
     border-bottom: 2px solid #dee2e6;
+    text-align: left;
 }
 
 table td {
-    padding: .3em 1em;
     vertical-align: top;
     border-top: 1px solid #dee2e6;
 }
 
-td.right {
+th.right, td.right {
     text-align: right;
 }