From a25e2930216df3f80b604a8b6d1812ce3868f6d8 Mon Sep 17 00:00:00 2001
From: Matthew Berns <mberns@instructure.com>
Date: Mon, 11 Jun 2018 14:08:06 -0500
Subject: [PATCH] fix styling in Safari when rubric is displayed

fixes OUT-2287

test plan:
test the following in all browsers:
- open a rubric for assessing in speedgrader
- the styling should appear correctly (boxes right size, no weird
  padding or white space, discription text should align to top of
  cell, etc)
- open a rubric for assessing on the submission show page
- the styling should appear correctly

Change-Id: I543671f144ecdc8015771be2ed79184f15a61c10
Reviewed-on: https://gerrit.instructure.com/153331
Reviewed-by: Frank Murphy <fmurphy@instructure.com>
Tested-by: Jenkins
Reviewed-by: Augusto Callejas <acallejas@instructure.com>
QA-Review: Augusto Callejas <acallejas@instructure.com>
Product-Review: Sidharth Oberoi <soberoi@instructure.com>
---
 app/stylesheets/components/_rubric.scss | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/app/stylesheets/components/_rubric.scss b/app/stylesheets/components/_rubric.scss
index 5415d042ccf..0eb6b7c2a00 100644
--- a/app/stylesheets/components/_rubric.scss
+++ b/app/stylesheets/components/_rubric.scss
@@ -46,8 +46,7 @@
 
 .react-rubric .description-header {
   height: 100%;
-  display: flex;
-  flex-direction: column;
+  vertical-align: text-top;
 
   & .long-description button {
     margin: 0;