Fix another Calendar layout bug

1 files changed, 12 insertions, 7 deletions

diff --git a/docs/css/spectre-exp.css b/docs/css/spectre-exp.css
index db27a7e..dadac19 100644
--- a/docs/css/spectre-exp.css
+++ b/docs/css/spectre-exp.css
@@ -140,7 +140,8 @@
   -ms-flex-direction: column;
   flex-direction: column;
   height: 11rem;
-  overflow-x: hidden;
+  overflow: hidden;
+  padding: 0;
 }
 .calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n) {
   border-right: 0;
@@ -156,12 +157,14 @@
   flex: 0 0 2.4rem;
   -ms-flex-item-align: end;
   height: 2.4rem;
+  margin-right: .5rem;
+  margin-top: .5rem;
   padding: .1rem;
   width: 2.4rem;
 }
 .calendar.calendar-lg .calendar-body .date-item.badge::after {
-  right: 0;
-  top: 0;
+  right: .2rem;
+  top: .2rem;
 }
 .calendar.calendar-lg .calendar-body .calendar-range .date-item::before {
   height: 2.4rem;
@@ -179,24 +182,26 @@
   width: auto;
 }
 .calendar.calendar-lg .calendar-events {
+  -webkit-flex-grow: 1;
+  flex-grow: 1;
+  -ms-flex-positive: 1;
   line-height: 1;
   overflow-y: auto;
-  padding: .5rem 0;
+  padding: .5rem;
 }
 .calendar.calendar-lg .calendar-event {
   background: #eff1fa;
   border-radius: .2rem;
   color: #5764c6;
-  display: inline-block;
+  display: block;
   font-size: 1.2rem;
-  line-height: 1;
+  margin: .2rem auto;
   overflow: hidden;
   padding: .3rem .4rem;
   text-align: left;
   text-overflow: ellipsis;
   vertical-align: baseline;
   white-space: nowrap;
-  width: 100%;
 }
 .carousel {
   background: #f8f8f8;