Как изменить положение элементов в математической разметке

@alanat · Регистрация: 16.07.2012

Author24 — интернет-сервис помощи студентам

Добрый день.
Есть разметка с кубическим корнем.

XML

<math>
<mroot>
<mi>x</mi>
<mn>3</mn>
</mroot>
</math>

CSS

@namespace "http://www.w3.org/1998/Math/MathML";
 
/* math */
math {
    display: inline;
    text-indent: 0;
}
math[display="block"] {
    display: block;
    text-align: center;
}
 
/* roots */
msqrt, mroot {
    display: inline-flex !important;
    margin-left: .5em;
    vertical-align: middle;
    border-top: solid thin;
}
msqrt:before, mroot:before {
    margin-left: -.5em;
    content: "\221A";
}
mroot > *:nth-child(2) {
    margin-right: .25em;
    margin-left: -.75em;
    font-size: 0.8em;
    order: -1;
}
 
/* token elements */
mi {
    font-style: italic;
}
math:active > semantics > *:first-child,
math:active > semantics > *:first-child {
    display: none !important;
}
math:active annotation:first-of-type {
    display: inline !important;
}

3 залезает на корень. Я пытался через <mn style="..."> её уменьшить, перенести чуть выше и правее (чтобы 3 была внутри галочки корня), но безрезультатно.
Подскажите, какие стили переносят 3, или это сделать не возможно?
Заранее благодарен за ответ.

@mrtoxas · 07.07.2020, 21:43

CSS

1	margin-top: -0.4em;

@alanat · 07.07.2020, 22:51 **[ТС]**

Сообщение от mrtoxas

margin-top: -0.4em;

Почему это не то же самое, что

CSS

1	margin: -0.4em 0 0 0;

, ведь именно так ещё можно записать этот же стиль?

@mrtoxas · 07.07.2020, 23:35

Потому что, у элемента уже есть отступы, а вы их обнуляете

CSS

1	margin: -.4em .25em 0 -.75em;

	07.07.2020, 23:35

Как изменить положение элементов в математической разметке

Решение