From 16b79a2a4223bef8acdb82c6daf09fba3a55542d Mon Sep 17 00:00:00 2001
From: Emily Eisenberg <emily@khanacademy.org>
Date: Tue, 22 Apr 2014 21:01:29 -0400
Subject: [PATCH] Fix the struts in IE9

Summary:
For some reason, `vertical-align: top` doesn't work in IE9, or at least doesn't
work the same as in any other browser (I'm too lazy to figure out what the
correct behavior really should be). Giving a literal value for `vertical-align`
works the same in all browsers, so use that instead.

Test Plan:
- Replace line 13 of static/index.html with

    <br>m<span id="math"></span>m

- See that the test page now looks good in Chrome, Firefox, and IE9
- See that huxley tests haven't changed

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D8384
---
 buildTree.js      | 4 ++++
 static/katex.less | 4 ----
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/buildTree.js b/buildTree.js
index 40c0e6be2..d98623f81 100644
--- a/buildTree.js
+++ b/buildTree.js
@@ -525,6 +525,10 @@ var buildTree = function(tree) {
 
     topStrut.style.height = span.height + "em";
     bottomStrut.style.height = (span.height + span.depth) + "em";
+    // We'd like to use `vertical-align: top` but in IE 9 this lowers the
+    // baseline of the box to the bottom of this strut (instead staying in the
+    // normal place) so we use an absolute value for vertical-align instead
+    bottomStrut.style.verticalAlign = -span.depth + "em";
 
     var katexNode = makeSpan(["katex"], [
         makeSpan(["katex-inner"], [topStrut, bottomStrut, span])
diff --git a/static/katex.less b/static/katex.less
index 432861ed9..a1144c290 100644
--- a/static/katex.less
+++ b/static/katex.less
@@ -23,10 +23,6 @@ big parens
 
     .strut {
         display: inline-block;
-
-        &.bottom {
-            vertical-align: top;
-        }
     }
 
     .mathit {