Bug 1665975 - Implement the math-style property. r=emilio
☠☠ backed out by 59b7e2557a2c ☠ ☠
authorFrederic Wang <fred.wang@free.fr>
Mon, 21 Sep 2020 05:41:51 +0000
changeset 549409 0da5103ba77273c97a78d81251747e20aa88b3a9
parent 549408 72b81792493cf19cccd997123f2d34037d9aabc7
child 549410 59b7e2557a2cb0947ccd4e8f108ca9f3a67bd81b
push id126760
push userbtara@mozilla.com
push dateMon, 21 Sep 2020 06:17:21 +0000
treeherderautoland@0da5103ba772 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersemilio
bugs1665975
milestone82.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1665975 - Implement the math-style property. r=emilio This patch renames the internal -moz-math-display to math-style and exposes it under the layout.css.math-style.enabled preference. The initial value becomes "normal" but that does not affect the default MathML behavior since the UA style sheet sets the math-style property explicitly on <math> tags. WPT tests are updated to use the syntax approved by the CSSWG. Intent to prototype: https://groups.google.com/forum/#!msg/mozilla.dev.platform/1hQQ7ISudGo/_yLEckEeBQAJ Differential Revision: https://phabricator.services.mozilla.com/D90731
devtools/server/actors/animation-type-longhand.js
layout/mathml/mathml.css
layout/mathml/nsMathMLmencloseFrame.cpp
layout/mathml/nsMathMLmfracFrame.cpp
layout/mathml/nsMathMLmmultiscriptsFrame.cpp
layout/mathml/nsMathMLmoFrame.cpp
layout/mathml/nsMathMLmrootFrame.cpp
layout/mathml/nsMathMLmunderoverFrame.cpp
layout/style/nsStyleConsts.h
layout/style/nsStyleStruct.cpp
layout/style/nsStyleStruct.h
layout/style/test/property_database.js
modules/libpref/init/StaticPrefList.yaml
servo/components/style/properties/longhands/font.mako.rs
servo/components/style/values/computed/font.rs
testing/web-platform/meta/css/css-fonts/math-script-level-and-math-style/__dir__.ini
testing/web-platform/meta/css/css-fonts/math-script-level-and-math-style/math-style-001.tentative.html.ini
testing/web-platform/meta/mathml/__dir__.ini
testing/web-platform/meta/mathml/relations/css-styling/attribute-mapping-002.html.ini
testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-002.tentative.html
testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-001.tentative.html
testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-002.tentative.html
testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-003.tentative.html
testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-004.tentative.html
testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-005.tentative.html
testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-style-001.tentative.html
testing/web-platform/tests/mathml/relations/css-styling/attribute-mapping-002.html
testing/web-platform/tests/mathml/relations/css-styling/presentational-hints-001-ref.html
testing/web-platform/tests/mathml/relations/css-styling/presentational-hints-001.html
--- a/devtools/server/actors/animation-type-longhand.js
+++ b/devtools/server/actors/animation-type-longhand.js
@@ -211,17 +211,17 @@ exports.ANIMATION_TYPE_FOR_LONGHANDS = [
       "inset-block-end",
       "inset-block-start",
       "inset-inline-end",
       "inset-inline-start",
       "margin-block-end",
       "margin-block-start",
       "margin-inline-end",
       "margin-inline-start",
-      "-moz-math-display",
+      "math-style",
       "max-block-size",
       "max-inline-size",
       "min-block-size",
       "-moz-min-font-size-ratio",
       "min-inline-size",
       "padding-block-end",
       "padding-block-start",
       "padding-inline-end",
--- a/layout/mathml/mathml.css
+++ b/layout/mathml/mathml.css
@@ -21,32 +21,32 @@ math {
   font-size: inherit;
   font-style: normal;
   font-family: serif;
   line-height: normal;
   word-spacing: normal;
   letter-spacing: normal;
   text-rendering: optimizeLegibility;
   -moz-float-edge: margin-box;
-  -moz-math-display: inline;
+  math-style: compact;
 }
 math[display="block" i] {
   display: block;
   text-align: -moz-center;
-  -moz-math-display: block;
+  math-style: normal;
 }
 math[display="inline" i] {
   display: inline;
-  -moz-math-display: inline;
+  math-style: compact;
 }
 math[displaystyle="false" i] {
-  -moz-math-display: inline;
+  math-style: compact;
 }
 math[displaystyle="true" i] {
-  -moz-math-display: block;
+  math-style: normal;
 }
 
 /**************************************************************************/
 /* Token elements                                                         */
 /**************************************************************************/
 
 ms {
   display: inline;
@@ -218,54 +218,54 @@ mtable[framespacing] > mtr > mtd {
 
 /**************************************************************************/
 /* Controlling Displaystyle and Scriptlevel                               */
 /**************************************************************************/
 
 /*
   http://www.w3.org/Math/draft-spec/chapter3.html#presm.scriptlevel
 
-  The determination of -moz-math-display for <math> involves the displaystyle
+  The determination of math-style for <math> involves the displaystyle
   and display attributes. See the <math> section above.
 */
 
 /*
-  Map mstyle@displaystyle to -moz-math-display.
+  Map mstyle@displaystyle to math-style.
 */
 mstyle[displaystyle="false" i] {
-  -moz-math-display: inline;
+  math-style: compact;
 }
 mstyle[displaystyle="true" i] {
-  -moz-math-display: block;
+  math-style: normal;
 }
 
 /*  munder, mover and munderover change the scriptlevels of their children
    using -moz-math-increment-script-level because regular CSS rules are
    insufficient to control when the scriptlevel should be incremented. All other
    cases can be described using regular CSS, so we do it this way because it's
    more efficient and less code. */
 :-moz-math-increment-script-level { -moz-script-level: +1; }
 
 /*
    The mfrac element sets displaystyle to "false", or if it was already false
    increments scriptlevel by 1, within numerator and denominator.
 */
 mfrac > * {
     -moz-script-level: auto;
-    -moz-math-display: inline;
+    math-style: compact;
 }
 
 /*
    The mroot element increments scriptlevel by 2, and sets displaystyle to
    "false", within index, but leaves both attributes unchanged within base.
    The msqrt element leaves both attributes unchanged within its argument.
 */
 mroot > :not(:first-child) {
     -moz-script-level: +2;
-    -moz-math-display: inline;
+    math-style: compact;
 }
 
 /*
    The msub element [...] increments scriptlevel by 1, and sets displaystyle to
    "false", within subscript, but leaves both attributes unchanged within base.
 
    The msup element [...] increments scriptlevel by 1, and sets displaystyle to
    "false", within superscript, but leaves both attributes unchanged within
@@ -279,17 +279,17 @@ mroot > :not(:first-child) {
    to "false", within each of its arguments except base, but leaves both
    attributes unchanged within base.
  */
 msub > :not(:first-child),
 msup > :not(:first-child),
 msubsup > :not(:first-child),
 mmultiscripts > :not(:first-child) {
     -moz-script-level: +1;
-    -moz-math-display: inline;
+    math-style: compact;
 }
 
 /*
    The munder element [...] always sets displaystyle to "false" within the
    underscript, but increments scriptlevel by 1 only when accentunder is
    "false". Within base, it always leaves both attributes unchanged.
 
    The mover element [...] always sets displaystyle to "false" within
@@ -299,34 +299,34 @@ mmultiscripts > :not(:first-child) {
    The munderover [..] always sets displaystyle to "false" within underscript
    and overscript, but increments scriptlevel by 1 only when accentunder or
    accent, respectively, are "false". Within base, it always leaves both
    attributes unchanged.
 */
 munder > :not(:first-child),
 mover > :not(:first-child),
 munderover > :not(:first-child) {
-    -moz-math-display: inline;
+    math-style: compact;
 }
 
 /*
    The displaystyle attribute is allowed on the mtable element to set the
    inherited value of the attribute. If the attribute is not present, the
    mtable element sets displaystyle to "false" within the table elements.
 */
-mtable { -moz-math-display: inline; }
-mtable[displaystyle="true" i] { -moz-math-display: block; }
+mtable { math-style: compact; }
+mtable[displaystyle="true" i] { math-style: normal; }
 
 /*
    The mscarries element sets displaystyle to "false", and increments
    scriptlevel by 1, so the children are typically displayed in a smaller font.
    XXXfredw: This element is not implemented yet. See bug 534967.
 mscarries {
   -moz-script-level: +1;
-  -moz-math-display: inline;
+  math-style: compact;
 }
 */
 
 /* "The mphantom element renders invisibly, but with the same size and other
    dimensions, including baseline position, that its contents would have if
    they were rendered normally.".
    Also, we do not expose the <mphantom> element to the accessible tree
    (see bug 1108378). */
--- a/layout/mathml/nsMathMLmencloseFrame.cpp
+++ b/layout/mathml/nsMathMLmencloseFrame.cpp
@@ -362,19 +362,19 @@ nsresult nsMathMLmencloseFrame::PlaceInt
   // We add a padding when needed.
 
   // determine padding & psi
   nscoord padding = 3 * mRuleThickness;
   nscoord delta = padding % onePixel;
   if (delta) padding += onePixel - delta;  // round up
 
   if (IsToDraw(NOTATION_LONGDIV) || IsToDraw(NOTATION_RADICAL)) {
-    GetRadicalParameters(
-        fm, StyleFont()->mMathDisplay == NS_MATHML_DISPLAYSTYLE_BLOCK,
-        mRadicalRuleThickness, leading, psi);
+    GetRadicalParameters(fm,
+                         StyleFont()->mMathStyle == NS_STYLE_MATH_STYLE_NORMAL,
+                         mRadicalRuleThickness, leading, psi);
 
     // make sure that the rule appears on on screen
     if (mRadicalRuleThickness < onePixel) {
       mRadicalRuleThickness = onePixel;
     }
 
     // adjust clearance psi to get an exact number of pixels -- this
     // gives a nicer & uniform look on stacked radicals (bug 130282)
--- a/layout/mathml/nsMathMLmfracFrame.cpp
+++ b/layout/mathml/nsMathMLmfracFrame.cpp
@@ -46,33 +46,33 @@ NS_IMPL_FRAMEARENA_HELPERS(nsMathMLmfrac
 nsMathMLmfracFrame::~nsMathMLmfracFrame() = default;
 
 eMathMLFrameType nsMathMLmfracFrame::GetMathMLFrameType() {
   // frac is "inner" in TeXBook, Appendix G, rule 15e. See also page 170.
   return eMathMLFrameType_Inner;
 }
 
 uint8_t nsMathMLmfracFrame::ScriptIncrement(nsIFrame* aFrame) {
-  if (!StyleFont()->mMathDisplay && aFrame &&
+  if (StyleFont()->mMathStyle == NS_STYLE_MATH_STYLE_COMPACT && aFrame &&
       (mFrames.FirstChild() == aFrame || mFrames.LastChild() == aFrame)) {
     return 1;
   }
   return 0;
 }
 
 NS_IMETHODIMP
 nsMathMLmfracFrame::TransmitAutomaticData() {
   // The TeXbook (Ch 17. p.141) says the numerator inherits the compression
   //  while the denominator is compressed
   UpdatePresentationDataFromChildAt(1, 1, NS_MATHML_COMPRESSED,
                                     NS_MATHML_COMPRESSED);
 
   // If displaystyle is false, then scriptlevel is incremented, so notify the
   // children of this.
-  if (!StyleFont()->mMathDisplay) {
+  if (StyleFont()->mMathStyle == NS_STYLE_MATH_STYLE_COMPACT) {
     PropagateFrameFlagFor(mFrames.FirstChild(),
                           NS_FRAME_MATHML_SCRIPT_DESCENDANT);
     PropagateFrameFlagFor(mFrames.LastChild(),
                           NS_FRAME_MATHML_SCRIPT_DESCENDANT);
   }
 
   // if our numerator is an embellished operator, let its state bubble to us
   GetEmbellishDataFrom(mFrames.FirstChild(), mEmbellishData);
@@ -259,17 +259,17 @@ nsresult nsMathMLmfracFrame::PlaceIntern
     if (mContent->AsElement()->GetAttr(kNameSpaceID_None, nsGkAtoms::bevelled_,
                                        value)) {
       mContent->OwnerDoc()->WarnOnceAbout(
           dom::Document::eMathML_DeprecatedBevelledAttribute);
       mIsBevelled = value.EqualsLiteral("true");
     }
   }
 
-  bool displayStyle = StyleFont()->mMathDisplay == NS_MATHML_DISPLAYSTYLE_BLOCK;
+  bool displayStyle = StyleFont()->mMathStyle == NS_STYLE_MATH_STYLE_NORMAL;
 
   if (!mIsBevelled) {
     mLineRect.height = mLineThickness;
 
     // by default, leave at least one-pixel padding at either end, and add
     // lspace & rspace that may come from <mo> if we are an outermost
     // embellished container (we fetch values from the core since they may use
     // units that depend on style data, and style changes could have occurred
@@ -506,17 +506,17 @@ nsresult nsMathMLmfracFrame::PlaceIntern
     delta =
         std::max(bmDen.ascent - bmNum.ascent, bmNum.descent - bmDen.descent) /
         2;
     if (delta > 0) {
       numShift += delta;
       denShift += delta;
     }
 
-    if (StyleFont()->mMathDisplay == NS_MATHML_DISPLAYSTYLE_BLOCK) {
+    if (StyleFont()->mMathStyle == NS_STYLE_MATH_STYLE_NORMAL) {
       delta =
           std::min(bmDen.ascent + bmDen.descent, bmNum.ascent + bmNum.descent) /
           2;
       numShift += delta;
       denShift += delta;
     } else {
       nscoord xHeight = fm->XHeight();
       numShift += xHeight / 2;
--- a/layout/mathml/nsMathMLmmultiscriptsFrame.cpp
+++ b/layout/mathml/nsMathMLmmultiscriptsFrame.cpp
@@ -263,17 +263,17 @@ nsresult nsMathMLmmultiscriptsFrame::Pla
     // on the current style
     nscoord supScriptShift1, supScriptShift2, supScriptShift3;
     // Set supScriptShift{1,2,3} default from font
     GetSupScriptShifts(fm, supScriptShift1, supScriptShift2, supScriptShift3);
 
     // get sup script shift depending on current script level and display style
     // Rule 18c, App. G, TeXbook
     if (font->mScriptLevel == 0 &&
-        font->mMathDisplay == NS_MATHML_DISPLAYSTYLE_BLOCK &&
+        font->mMathStyle == NS_STYLE_MATH_STYLE_NORMAL &&
         !NS_MATHML_IS_COMPRESSED(presentationData.flags)) {
       // Style D in TeXbook
       supScriptShift = supScriptShift1;
     } else if (NS_MATHML_IS_COMPRESSED(presentationData.flags)) {
       // Style C' in TeXbook = D',T',S',SS'
       supScriptShift = supScriptShift3;
     } else {
       // everything else = T,S,SS
--- a/layout/mathml/nsMathMLmoFrame.cpp
+++ b/layout/mathml/nsMathMLmoFrame.cpp
@@ -537,17 +537,17 @@ static uint32_t GetStretchHint(nsOperato
   // See if it is okay to stretch,
   // starting from what the Operator Dictionary said
   if (NS_MATHML_OPERATOR_IS_MUTABLE(aFlags)) {
     // set the largeop or largeopOnly flags to suitably cover all the
     // 8 possible cases depending on whether displaystyle, largeop,
     // stretchy are true or false (see bug 69325).
     // . largeopOnly is taken if largeop=true and stretchy=false
     // . largeop is taken if largeop=true and stretchy=true
-    if (aStyleFont->mMathDisplay == NS_MATHML_DISPLAYSTYLE_BLOCK &&
+    if (aStyleFont->mMathStyle == NS_STYLE_MATH_STYLE_NORMAL &&
         NS_MATHML_OPERATOR_IS_LARGEOP(aFlags)) {
       stretchHint = NS_STRETCH_LARGEOP;  // (largeopOnly, not mask!)
       if (NS_MATHML_OPERATOR_IS_INTEGRAL(aFlags)) {
         stretchHint |= NS_STRETCH_INTEGRAL;
       }
       if (NS_MATHML_OPERATOR_IS_STRETCHY(aFlags)) {
         stretchHint |= NS_STRETCH_NEARER | NS_STRETCH_LARGER;
       }
@@ -933,18 +933,17 @@ nsresult nsMathMLmoFrame::Place(DrawTarg
      So largeop display operators should be considered "non-stretchy" and
      thus their sizes should be taken into account for the stretch size of
      other elements.
 
      This is a preliminary stretch - exact sizing/placement is handled by the
      Stretch() method.
   */
 
-  if (!aPlaceOrigin &&
-      StyleFont()->mMathDisplay == NS_MATHML_DISPLAYSTYLE_BLOCK &&
+  if (!aPlaceOrigin && StyleFont()->mMathStyle == NS_STYLE_MATH_STYLE_NORMAL &&
       NS_MATHML_OPERATOR_IS_LARGEOP(mFlags) && UseMathMLChar()) {
     nsBoundingMetrics newMetrics;
     rv = mMathMLChar.Stretch(
         this, aDrawTarget, nsLayoutUtils::FontSizeInflationFor(this),
         NS_STRETCH_DIRECTION_VERTICAL, aDesiredSize.mBoundingMetrics,
         newMetrics, NS_STRETCH_LARGEOP,
         StyleVisibility()->mDirection == StyleDirection::Rtl);
 
--- a/layout/mathml/nsMathMLmrootFrame.cpp
+++ b/layout/mathml/nsMathMLmrootFrame.cpp
@@ -198,19 +198,19 @@ void nsMathMLmrootFrame::Reflow(nsPresCo
   ////////////
   // Prepare the radical symbol and the overline bar
 
   float fontSizeInflation = nsLayoutUtils::FontSizeInflationFor(this);
   RefPtr<nsFontMetrics> fm =
       nsLayoutUtils::GetFontMetricsForFrame(this, fontSizeInflation);
 
   nscoord ruleThickness, leading, psi;
-  GetRadicalParameters(
-      fm, StyleFont()->mMathDisplay == NS_MATHML_DISPLAYSTYLE_BLOCK,
-      ruleThickness, leading, psi);
+  GetRadicalParameters(fm,
+                       StyleFont()->mMathStyle == NS_STYLE_MATH_STYLE_NORMAL,
+                       ruleThickness, leading, psi);
 
   // built-in: adjust clearance psi to emulate \mathstrut using '1' (TexBook,
   // p.131)
   char16_t one = '1';
   nsBoundingMetrics bmOne =
       nsLayoutUtils::AppUnitBoundsOfString(&one, 1, *fm, drawTarget);
   if (bmOne.ascent > bmBase.ascent) psi += bmOne.ascent - bmBase.ascent;
 
--- a/layout/mathml/nsMathMLmunderoverFrame.cpp
+++ b/layout/mathml/nsMathMLmunderoverFrame.cpp
@@ -50,17 +50,17 @@ nsresult nsMathMLmunderoverFrame::Attrib
 
 NS_IMETHODIMP
 nsMathMLmunderoverFrame::UpdatePresentationData(uint32_t aFlagsValues,
                                                 uint32_t aFlagsToUpdate) {
   nsMathMLContainerFrame::UpdatePresentationData(aFlagsValues, aFlagsToUpdate);
   // disable the stretch-all flag if we are going to act like a
   // subscript-superscript pair
   if (NS_MATHML_EMBELLISH_IS_MOVABLELIMITS(mEmbellishData.flags) &&
-      StyleFont()->mMathDisplay == NS_MATHML_DISPLAYSTYLE_INLINE) {
+      StyleFont()->mMathStyle == NS_STYLE_MATH_STYLE_COMPACT) {
     mPresentationData.flags &= ~NS_MATHML_STRETCH_ALL_CHILDREN_HORIZONTALLY;
   } else {
     mPresentationData.flags |= NS_MATHML_STRETCH_ALL_CHILDREN_HORIZONTALLY;
   }
   return NS_OK;
 }
 
 NS_IMETHODIMP
@@ -250,17 +250,17 @@ XXX The winner is the outermost setting 
       } else if (value.EqualsLiteral("false")) {
         mEmbellishData.flags &= ~NS_MATHML_EMBELLISH_ACCENTOVER;
       }
     }
   }
 
   bool subsupDisplay =
       NS_MATHML_EMBELLISH_IS_MOVABLELIMITS(mEmbellishData.flags) &&
-      StyleFont()->mMathDisplay == NS_MATHML_DISPLAYSTYLE_INLINE;
+      StyleFont()->mMathStyle == NS_STYLE_MATH_STYLE_COMPACT;
 
   // disable the stretch-all flag if we are going to act like a superscript
   if (subsupDisplay) {
     mPresentationData.flags &= ~NS_MATHML_STRETCH_ALL_CHILDREN_HORIZONTALLY;
   }
 
   // Now transmit any change that we want to our children so that they
   // can update their mPresentationData structs
@@ -344,31 +344,31 @@ The REC says:
    operator whose <mo> element core has movablelimits="true"), and
    displaystyle="false", then underscript and overscript are drawn in
    a subscript and superscript position, respectively. In this case,
    the accent and accentunder attributes are ignored. This is often
    used for limits on symbols such as &sum;.
 
 i.e.,:
  if (NS_MATHML_EMBELLISH_IS_MOVABLELIMITS(mEmbellishDataflags) &&
-     StyleFont()->mMathDisplay == NS_MATHML_DISPLAYSTYLE_INLINE) {
+     StyleFont()->mMathStyle == NS_STYLE_MATH_STYLE_COMPACT) {
   // place like subscript-superscript pair
  }
  else {
   // place like underscript-overscript pair
  }
 */
 
 /* virtual */
 nsresult nsMathMLmunderoverFrame::Place(DrawTarget* aDrawTarget,
                                         bool aPlaceOrigin,
                                         ReflowOutput& aDesiredSize) {
   float fontSizeInflation = nsLayoutUtils::FontSizeInflationFor(this);
   if (NS_MATHML_EMBELLISH_IS_MOVABLELIMITS(mEmbellishData.flags) &&
-      StyleFont()->mMathDisplay == NS_MATHML_DISPLAYSTYLE_INLINE) {
+      StyleFont()->mMathStyle == NS_STYLE_MATH_STYLE_COMPACT) {
     // place like sub sup or subsup
     if (mContent->IsMathMLElement(nsGkAtoms::munderover_)) {
       return nsMathMLmmultiscriptsFrame::PlaceMultiScript(
           PresContext(), aDrawTarget, aPlaceOrigin, aDesiredSize, this, 0, 0,
           fontSizeInflation);
     } else if (mContent->IsMathMLElement(nsGkAtoms::munder_)) {
       return nsMathMLmmultiscriptsFrame::PlaceMultiScript(
           PresContext(), aDrawTarget, aPlaceOrigin, aDesiredSize, this, 0, 0,
--- a/layout/style/nsStyleConsts.h
+++ b/layout/style/nsStyleConsts.h
@@ -415,19 +415,19 @@ enum class StyleGridTrackBreadth : uint8
 #define NS_MATHML_MATHVARIANT_SANS_SERIF_ITALIC 12
 #define NS_MATHML_MATHVARIANT_SANS_SERIF_BOLD_ITALIC 13
 #define NS_MATHML_MATHVARIANT_MONOSPACE 14
 #define NS_MATHML_MATHVARIANT_INITIAL 15
 #define NS_MATHML_MATHVARIANT_TAILED 16
 #define NS_MATHML_MATHVARIANT_LOOPED 17
 #define NS_MATHML_MATHVARIANT_STRETCHED 18
 
-// See nsStyleFont::mMathDisplay
-#define NS_MATHML_DISPLAYSTYLE_INLINE 0
-#define NS_MATHML_DISPLAYSTYLE_BLOCK 1
+// See nsStyleFont::mMathStyle
+#define NS_STYLE_MATH_STYLE_COMPACT 0
+#define NS_STYLE_MATH_STYLE_NORMAL 1
 
 // See nsStyleDisplay.mPosition
 enum class StylePositionProperty : uint8_t {
   Static,
   Relative,
   Absolute,
   Fixed,
   Sticky,
--- a/layout/style/nsStyleStruct.cpp
+++ b/layout/style/nsStyleStruct.cpp
@@ -223,17 +223,17 @@ nsStyleFont::nsStyleFont(const nsStyleFo
     : mFont(aSrc.mFont),
       mSize(aSrc.mSize),
       mFontSizeFactor(aSrc.mFontSizeFactor),
       mFontSizeOffset(aSrc.mFontSizeOffset),
       mFontSizeKeyword(aSrc.mFontSizeKeyword),
       mGenericID(aSrc.mGenericID),
       mScriptLevel(aSrc.mScriptLevel),
       mMathVariant(aSrc.mMathVariant),
-      mMathDisplay(aSrc.mMathDisplay),
+      mMathStyle(aSrc.mMathStyle),
       mMinFontSizeRatio(aSrc.mMinFontSizeRatio),
       mExplicitLanguage(aSrc.mExplicitLanguage),
       mAllowZoomAndMinSize(aSrc.mAllowZoomAndMinSize),
       mScriptUnconstrainedSize(aSrc.mScriptUnconstrainedSize),
       mScriptMinSize(aSrc.mScriptMinSize),
       mScriptSizeMultiplier(aSrc.mScriptSizeMultiplier),
       mLanguage(aSrc.mLanguage) {
   MOZ_COUNT_CTOR(nsStyleFont);
@@ -244,17 +244,17 @@ nsStyleFont::nsStyleFont(const Document&
           StyleGenericFontFamily::None)),
       mSize(ZoomText(aDocument, mFont.size)),
       mFontSizeFactor(1.0),
       mFontSizeOffset{0},
       mFontSizeKeyword(StyleFontSizeKeyword::Medium),
       mGenericID(StyleGenericFontFamily::None),
       mScriptLevel(0),
       mMathVariant(NS_MATHML_MATHVARIANT_NONE),
-      mMathDisplay(NS_MATHML_DISPLAYSTYLE_INLINE),
+      mMathStyle(NS_STYLE_MATH_STYLE_NORMAL),
       mMinFontSizeRatio(100),  // 100%
       mExplicitLanguage(false),
       mAllowZoomAndMinSize(true),
       mScriptUnconstrainedSize(mSize),
       mScriptMinSize(Length::FromPixels(
           CSSPixel::FromPoints(NS_MATHML_DEFAULT_SCRIPT_MIN_SIZE_PT))),
       mScriptSizeMultiplier(NS_MATHML_DEFAULT_SCRIPT_SIZE_MULTIPLIER),
       mLanguage(aDocument.GetLanguageForStyle()) {
@@ -271,17 +271,17 @@ nsStyleFont::nsStyleFont(const Document&
 
 nsChangeHint nsStyleFont::CalcDifference(const nsStyleFont& aNewData) const {
   MOZ_ASSERT(
       mAllowZoomAndMinSize == aNewData.mAllowZoomAndMinSize,
       "expected mAllowZoomAndMinSize to be the same on both nsStyleFonts");
   if (mSize != aNewData.mSize || mLanguage != aNewData.mLanguage ||
       mExplicitLanguage != aNewData.mExplicitLanguage ||
       mMathVariant != aNewData.mMathVariant ||
-      mMathDisplay != aNewData.mMathDisplay ||
+      mMathStyle != aNewData.mMathStyle ||
       mMinFontSizeRatio != aNewData.mMinFontSizeRatio) {
     return NS_STYLE_HINT_REFLOW;
   }
 
   switch (mFont.CalcDifference(aNewData.mFont)) {
     case nsFont::MaxDifference::eLayoutAffecting:
       return NS_STYLE_HINT_REFLOW;
 
--- a/layout/style/nsStyleStruct.h
+++ b/layout/style/nsStyleStruct.h
@@ -109,18 +109,18 @@ struct MOZ_NEEDS_MEMMOVABLE_MEMBERS nsSt
   mozilla::StyleFontSizeKeyword mFontSizeKeyword;
 
   mozilla::StyleGenericFontFamily mGenericID;
 
   // MathML scriptlevel support
   int8_t mScriptLevel;
   // MathML  mathvariant support
   uint8_t mMathVariant;
-  // MathML displaystyle support
-  uint8_t mMathDisplay;
+  // math-style support (used for MathML displaystyle)
+  uint8_t mMathStyle;
 
   // allow different min font-size for certain cases
   uint8_t mMinFontSizeRatio;  // percent * 100
 
   // was mLanguage set based on a lang attribute in the document?
   bool mExplicitLanguage;
 
   // should calls to ZoomText() and UnZoomText() be made to the font
--- a/layout/style/test/property_database.js
+++ b/layout/style/test/property_database.js
@@ -9136,16 +9136,24 @@ var gCSSProperties = {
   "marker-start": {
     domProp: "markerStart",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     initial_values: ["none"],
     other_values: ["url(#mysym)"],
     invalid_values: [],
   },
+  "math-style": {
+    domProp: "mathStyle",
+    inherited: true,
+    type: CSS_TYPE_LONGHAND,
+    initial_values: ["normal"],
+    other_values: ["compact"],
+    invalid_values: [],
+  },
   "mix-blend-mode": {
     domProp: "mixBlendMode",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
     initial_values: ["normal"],
     other_values: [
       "multiply",
       "screen",
--- a/modules/libpref/init/StaticPrefList.yaml
+++ b/modules/libpref/init/StaticPrefList.yaml
@@ -6044,16 +6044,23 @@
 #
 # [1]: https://drafts.csswg.org/css-pseudo-4/#selectordef-marker
 - name: layout.css.marker.restricted
   type: RelaxedAtomicBool
   value: true
   mirror: always
   rust: true
 
+# Is support for math-style enabled?
+- name: layout.css.math-style.enabled
+  type: RelaxedAtomicBool
+  value: @IS_NIGHTLY_BUILD@
+  mirror: always
+  rust: true
+
 # Pref to control whether @-moz-document rules are enabled in content pages.
 - name: layout.css.moz-document.content.enabled
   type: RelaxedAtomicBool
   value: false
   mirror: always
   rust: true
 
 # Whether the ::-moz-focus-outer pseudo-class is parsed.
--- a/servo/components/style/properties/longhands/font.mako.rs
+++ b/servo/components/style/properties/longhands/font.mako.rs
@@ -234,24 +234,24 @@
     engines="gecko",
     animation_value_type="none",
     enabled_in="ua",
     gecko_ffi_name="mScriptLevel",
     spec="Internal (not web-exposed)",
 )}
 
 ${helpers.single_keyword(
-    "-moz-math-display",
-    "inline block",
+    "math-style",
+    "compact normal",
     engines="gecko",
-    gecko_constant_prefix="NS_MATHML_DISPLAYSTYLE",
-    gecko_ffi_name="mMathDisplay",
+    gecko_pref="layout.css.math-style.enabled",
+    spec="https://mathml-refresh.github.io/mathml-core/#the-math-style-property",
+    has_effect_on_gecko_scrollbars=False,
+    animation_value_type="none",
     enabled_in="ua",
-    spec="Internal (not web-exposed)",
-    animation_value_type="none",
 )}
 
 ${helpers.single_keyword(
     "-moz-math-variant",
     """none normal bold italic bold-italic script bold-script
     fraktur double-struck bold-fraktur sans-serif
     bold-sans-serif sans-serif-italic sans-serif-bold-italic
     monospace initial tailed looped stretched""",
--- a/servo/components/style/values/computed/font.rs
+++ b/servo/components/style/values/computed/font.rs
@@ -814,24 +814,24 @@ impl ToComputedValue for specified::MozS
 /// The computed value of the -moz-script-level property.
 pub type MozScriptLevel = i8;
 
 #[cfg(feature = "gecko")]
 impl ToComputedValue for specified::MozScriptLevel {
     type ComputedValue = MozScriptLevel;
 
     fn to_computed_value(&self, cx: &Context) -> i8 {
-        use crate::properties::longhands::_moz_math_display::SpecifiedValue as DisplayValue;
+        use crate::properties::longhands::math_style::SpecifiedValue as MathStyleValue;
         use std::{cmp, i8};
 
         let int = match *self {
             specified::MozScriptLevel::Auto => {
                 let parent = cx.builder.get_parent_font().clone__moz_script_level() as i32;
-                let display = cx.builder.get_parent_font().clone__moz_math_display();
-                if display == DisplayValue::Inline {
+                let style = cx.builder.get_parent_font().clone_math_style();
+                if style == MathStyleValue::Compact {
                     parent + 1
                 } else {
                     parent
                 }
             },
             specified::MozScriptLevel::Relative(rel) => {
                 let parent = cx.builder.get_parent_font().clone__moz_script_level();
                 parent as i32 + rel
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/meta/css/css-fonts/math-script-level-and-math-style/__dir__.ini
@@ -0,0 +1,1 @@
+prefs: [layout.css.math-style.enabled: true]
\ No newline at end of file
deleted file mode 100644
--- a/testing/web-platform/meta/css/css-fonts/math-script-level-and-math-style/math-style-001.tentative.html.ini
+++ /dev/null
@@ -1,10 +0,0 @@
-[math-style-001.tentative.html]
-  [Specified values of math-style]
-    expected: FAIL
-
-  [Inherited values of math-style]
-    expected: FAIL
-
-  [Initial value of math-style]
-    expected: FAIL
-
--- a/testing/web-platform/meta/mathml/__dir__.ini
+++ b/testing/web-platform/meta/mathml/__dir__.ini
@@ -1,1 +1,1 @@
-prefs: [mathml.deprecated_style_attributes.disabled: true, mathml.deprecated_menclose_notation_radical.disabled: true, mathml.mathsize_names.disabled:true, mathml.mathspace_names.disabled: true, mathml.mfrac_linethickness_names.disabled:true, mathml.deprecated_alignment_attributes.disabled: true, mathml.script_shift_attributes.disabled: true, mathml.mfrac_bevelled_attribute.disabled: true, mathml.mfenced_element.disabled: true]
\ No newline at end of file
+prefs: [mathml.deprecated_style_attributes.disabled: true, mathml.deprecated_menclose_notation_radical.disabled: true, mathml.mathsize_names.disabled:true, mathml.mathspace_names.disabled: true, mathml.mfrac_linethickness_names.disabled:true, mathml.deprecated_alignment_attributes.disabled: true, mathml.script_shift_attributes.disabled: true, mathml.mfrac_bevelled_attribute.disabled: true, mathml.mfenced_element.disabled: true, layout.css.math-style.enabled: true]
\ No newline at end of file
--- a/testing/web-platform/meta/mathml/relations/css-styling/attribute-mapping-002.html.ini
+++ b/testing/web-platform/meta/mathml/relations/css-styling/attribute-mapping-002.html.ini
@@ -57,19 +57,16 @@
     expected: FAIL
 
   [mathvariant on the mpadded element is mapped to CSS text-transform]
     expected: FAIL
 
   [displaystyle on the msqrt element is mapped to CSS math-style]
     expected: FAIL
 
-  [displaystyle on the mstyle element is mapped to CSS math-style]
-    expected: FAIL
-
   [mathvariant on the mprescripts element is mapped to CSS text-transform]
     expected: FAIL
 
   [mathvariant on the menclose element is mapped to CSS text-transform]
     expected: FAIL
 
   [displaystyle on the merror element is mapped to CSS math-style]
     expected: FAIL
@@ -111,19 +108,16 @@
     expected: FAIL
 
   [displaystyle on the mn element is mapped to CSS math-style]
     expected: FAIL
 
   [displaystyle on the mi element is mapped to CSS math-style]
     expected: FAIL
 
-  [displaystyle on the math element is mapped to CSS math-style]
-    expected: FAIL
-
   [mathvariant on the mmultiscripts element is mapped to CSS text-transform]
     expected: FAIL
 
   [mathvariant on the mstyle element is mapped to CSS text-transform]
     expected: FAIL
 
   [mathvariant on the mtext element is mapped to CSS text-transform]
     expected: FAIL
@@ -132,19 +126,16 @@
     expected: FAIL
 
   [displaystyle on the msubsup element is mapped to CSS math-style]
     expected: FAIL
 
   [displaystyle on the mrow element is mapped to CSS math-style]
     expected: FAIL
 
-  [displaystyle on the mtable element is mapped to CSS math-style]
-    expected: FAIL
-
   [mathvariant on the annotation-xml element is mapped to CSS text-transform]
     expected: FAIL
 
   [displaystyle on the none element is mapped to CSS math-style]
     expected: FAIL
 
   [mathvariant on the mroot element is mapped to CSS text-transform]
     expected: FAIL
--- a/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-002.tentative.html
+++ b/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-002.tentative.html
@@ -75,28 +75,28 @@
       });
     </script>
   </head>
   <body>
     <div id="log"></div>
     <div>
       <div class="container">
         <div>
-          <div style="font-size: 200px; math-style: display">
+          <div style="font-size: 200px; math-style: normal">
             <div id="autoDisplay" style="font-size: scriptlevel(auto)"></div>
           </div>
-          <div style="font-size: 500px; math-style: inline">
+          <div style="font-size: 500px; math-style: compact">
             <div id="autoInline" style="font-size: scriptlevel(auto)"></div>
           </div>
         </div>
         <div style="font-size: 2000px;">
-          <div style="math-style: display; font-size: scriptlevel(7)">
+          <div style="math-style: normal; font-size: scriptlevel(7)">
             <div id="autoDisplayFrom7" style="font-size: scriptlevel(auto)"></div>
           </div>
-          <div style="math-style: inline; font-size: scriptlevel(7)">
+          <div style="math-style: compact; font-size: scriptlevel(7)">
             <div id="autoInlineFrom7" style="font-size: scriptlevel(auto)"></div>
           </div>
         </div>
         <div>
           <div style="font-size: 200px">
             <div id="add0" style="font-size: scriptlevel(add(0))"></div>
           </div>
           <div style="font-size: 71px">
--- a/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-001.tentative.html
+++ b/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-001.tentative.html
@@ -1,26 +1,26 @@
 <!DOCTYPE html>
 <html>
   <head>
     <title>math-script-level: auto and math-style</title>
     <meta charset="utf-8">
     <link rel="help" href="https://github.com/w3c/csswg-drafts/issues/3746">
     <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#the-math-script-level-property">
     <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#the-math-style-property">
-    <meta name="assert" content="If font-size is scriptlevel('auto') and the inherited value of math-style is 'display' then the internal scriptlevel is the one of its parent.">
+    <meta name="assert" content="If font-size is scriptlevel('auto') and the inherited value of math-style is 'normal' then the internal scriptlevel is the one of its parent.">
     <link rel="match" href="math-script-level-auto-and-math-style-001.tentative-ref.html">
     <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
     <style>
       .container {
           /* Ahem font does not have a MATH table so the font-size scale factor
              is always 0.71^{computed - inherited math script level} */
           font: 100px/1 Ahem;
       }
     </style>
   </head>
   <body>
     <p>Test passes if you see a square of side 100 × 0.71^(0 − 0) = 100px.</p>
-    <div class="container" style="math-style: display;">
+    <div class="container" style="math-style: normal;">
       <div style="font-size: scriptlevel(auto)">X</div>
     </div>
   </body>
 </html>
--- a/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-002.tentative.html
+++ b/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-002.tentative.html
@@ -1,26 +1,26 @@
 <!DOCTYPE html>
 <html>
   <head>
     <title>math-script-level: auto and math-style</title>
     <meta charset="utf-8">
     <link rel="help" href="https://github.com/w3c/csswg-drafts/issues/3746">
     <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#the-math-script-level-property">
     <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#the-math-style-property">
-    <meta name="assert" content="If font-size is scriptlevel('auto') and the inherited value of math-style is 'inline' then the internal scriptlevel is the one of its parent.">
+    <meta name="assert" content="If font-size is scriptlevel('auto') and the inherited value of math-style is 'compact' then the internal scriptlevel is the one of its parent.">
     <link rel="match" href="math-script-level-auto-and-math-style-002.tentative-ref.html">
     <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
     <style>
       .container {
           /* Ahem font does not have a MATH table so the font-size scale factor
              is always 0.71^{computed - inherited math script level} */
           font: 500px/1 Ahem;
       }
     </style>
   </head>
   <body>
     <p>Test passes if you see a square of side 500 × 0.71^(1 − 0) = 355px.</p>
-    <div class="container" style="math-style: inline;">
+    <div class="container" style="math-style: compact;">
       <div style="font-size: scriptlevel(auto)">X</div>
     </div>
   </body>
 </html>
--- a/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-003.tentative.html
+++ b/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-003.tentative.html
@@ -1,17 +1,17 @@
 <!DOCTYPE html>
 <html>
   <head>
     <title>math-script-level: auto and math-style</title>
     <meta charset="utf-8">
     <link rel="help" href="https://github.com/w3c/csswg-drafts/issues/3746">
     <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#the-math-script-level-property">
     <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#the-math-style-property">
-    <meta name="assert" content="Initial value of math-style is 'inline'">
+    <meta name="assert" content="Initial value of math-style is 'compact'">
     <link rel="match" href="math-script-level-auto-and-math-style-003.tentative-ref.html">
     <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
     <style>
       .container {
           /* Ahem font does not have a MATH table so the font-size scale factor
              is always 0.71^{computed - inherited math script level} */
           font: 500px/1 Ahem;
       }
--- a/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-004.tentative.html
+++ b/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-004.tentative.html
@@ -1,30 +1,30 @@
 <!DOCTYPE html>
 <html>
   <head>
     <title>math-script-level: auto and math-style</title>
     <meta charset="utf-8">
     <link rel="help" href="https://github.com/w3c/csswg-drafts/issues/3746">
     <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#the-math-script-level-property">
     <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#the-math-style-property">
-    <meta name="assert" content="Initial value of math-style is 'inline'">
+    <meta name="assert" content="Initial value of math-style is 'compact'">
     <link rel="match" href="math-script-level-auto-and-math-style-004.tentative-ref.html">
     <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
     <style>
       .container {
           /* Ahem font does not have a MATH table so the font-size scale factor
              is always 0.71^{computed - inherited math script level} */
           font: 500px/1 Ahem;
       }
     </style>
   </head>
   <body>
     <p>Test passes if you see a square of side 500 × 0.71^(1 − 0) = 355px.</p>
     <div class="container">
-      <div style="math-style: display">
+      <div style="math-style: normal">
         <div style="math-style: initial">
           <div style="font-size: scriptlevel(auto)">X</div>
         </div>
       </div>
     </div>
   </body>
 </html>
--- a/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-005.tentative.html
+++ b/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-script-level-auto-and-math-style-005.tentative.html
@@ -15,17 +15,17 @@
              is always 0.71^{computed - inherited math script level} */
           font: 100px/1 Ahem;
       }
     </style>
   </head>
   <body>
     <p>Test passes if you see a square of side 100 × 0.71^(0 − 0) = 100px.</p>
     <div class="container">
-      <div style="math-style: display;">
+      <div style="math-style: normal;">
         <div>
           <div>
             <div style="font-size: scriptlevel(auto)">X</div>
           </div>
         </div>
       </div>
     </div>
   </body>
--- a/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-style-001.tentative.html
+++ b/testing/web-platform/tests/css/css-fonts/math-script-level-and-math-style/math-style-001.tentative.html
@@ -11,33 +11,33 @@
     <script>
       function mathStyle(id) {
           return window.getComputedStyle(document.getElementById(id)).
               getPropertyValue("math-style");
       }
       setup({ explicit_done: true });
       window.addEventListener("load", function() {
           test(function() {
-              assert_equals(mathStyle("initial"), "inline");
+              assert_equals(mathStyle("initial"), "normal");
           }, "Initial value of math-style");
           test(function() {
-              assert_equals(mathStyle("specifiedInline"), "inline");
-              assert_equals(mathStyle("specifiedDisplay"), "display");
+              assert_equals(mathStyle("specifiedInline"), "compact");
+              assert_equals(mathStyle("specifiedDisplay"), "normal");
           }, "Specified values of math-style");
           test(function() {
-              assert_equals(mathStyle("inheritedInline"), "inline");
-              assert_equals(mathStyle("inheritedDisplay"), "display");
+              assert_equals(mathStyle("inheritedInline"), "compact");
+              assert_equals(mathStyle("inheritedDisplay"), "normal");
           }, "Inherited values of math-style");
           done();
       });
     </script>
   </head>
   <body>
     <div id="log"></div>
     <div id="initial"></div>
-    <div id="specifiedInline" style="math-style: inline">
+    <div id="specifiedInline" style="math-style: compact">
       <div id="inheritedInline"></div>
     </div>
-    <div id="specifiedDisplay" style="math-style: display">
+    <div id="specifiedDisplay" style="math-style: normal">
       <div id="inheritedDisplay"></div>
     </div>
   </body>
 </html>
--- a/testing/web-platform/tests/mathml/relations/css-styling/attribute-mapping-002.html
+++ b/testing/web-platform/tests/mathml/relations/css-styling/attribute-mapping-002.html
@@ -64,21 +64,21 @@
 
               element.setAttribute("scriptlevel", absoluteScriptlevel);
               element.setAttribute("mathsize", "42px");
               assert_approx_equals(fontSize(style), 42, epsilon, "mathsize wins over scriptlevel");
 
           }, `scriptlevel on the ${tag} element is mapped to font-size: scriptlevel(...)`);
 
           test(function() {
-              assert_equals(style.getPropertyValue("math-style"), "inline", "no attribute");
+              assert_equals(style.getPropertyValue("math-style"), "compact", "no attribute");
               element.setAttribute("displaystyle", "true");
-              assert_equals(style.getPropertyValue("math-style"), "display", "attribute specified");
+              assert_equals(style.getPropertyValue("math-style"), "normal", "attribute specified");
               element.setAttribute("displaystyle", "TrUe");
-              assert_equals(style.getPropertyValue("math-style"), "display", "case insensitive");
+              assert_equals(style.getPropertyValue("math-style"), "normal", "case insensitive");
           }, `displaystyle on the ${tag} element is mapped to CSS math-style`);
       });
 
       done();
   }
 </script>
 </head>
 <body>
--- a/testing/web-platform/tests/mathml/relations/css-styling/presentational-hints-001-ref.html
+++ b/testing/web-platform/tests/mathml/relations/css-styling/presentational-hints-001-ref.html
@@ -41,17 +41,17 @@
     </math>
   </p>
   <p>mathvariant:
     <math style="font-family: DoubleStruck, Italic;">
       <mtext style="text-transform: math-italic">&#x628;</mtext>
     </math>
   </p>
   <p>displaystyle:
-    <math style="math-style: inline">
+    <math style="math-style: compact">
       <munder>
         <mo movablelimits="true">X</mo>
         <mo>X</mo>
       </munder>
     </math>
   </p>
   <p>scriptlevel:
     <math>
--- a/testing/web-platform/tests/mathml/relations/css-styling/presentational-hints-001.html
+++ b/testing/web-platform/tests/mathml/relations/css-styling/presentational-hints-001.html
@@ -51,17 +51,17 @@
   </p>
   <p>mathvariant:
     <math style="font-family: DoubleStruck, Italic;">
       <mtext mathvariant="double-struck"
              style="text-transform: math-italic">&#x628;</mtext>
     </math>
   </p>
   <p>displaystyle:
-    <math displaystyle="true" style="math-style: inline">
+    <math displaystyle="true" style="math-style: compact">
       <munder>
         <mo movablelimits="true">X</mo>
         <mo>X</mo>
       </munder>
     </math>
   </p>
   <p>scriptlevel:
     <math>