Skip to content

Consider using CSS styling for equation solving #86

@samimaattaCelia

Description

@samimaattaCelia

I was just playing around with multirow maths and I have thought that the equation solving doesn't look that nice when all of the text is centered inside the <mtd> elements:

Image

I wrote some CSS to make it look nicer:

Image

Here is the CSS:

.equation-solving {

  & mtd:first-child {
    text-align: right;
  }

  & mtd {
    text-align: left;
  }
}

Here is the MathML, if you want to try it (I didn't try this in an EPUB yet.):

<math display="block">
    <mtable class="equation-solving">
    <mtr>
        <mtd>
            <mi>x</mi>
            <mo></mo>
            <mn>5</mn>
        </mtd>
        <mtd>
            <mo>=</mo>
        </mtd>
        <mtd>
            <mn>7</mn>
        </mtd>
    </mtr>
    <mtr>
        <mtd>
            <mi>x</mi>
        </mtd>
        <mtd>
            <mo>=</mo>  
        </mtd>
        <mtd>
            <mn>7</mn>
            <mo>+</mo>
            <mn>5</mn>
        </mtd>
    </mtr>
    <mtr>
        <mtd>
            <mi>x</mi>
        </mtd>
        <mtd>
            <mo>=</mo>  
        </mtd>
        <mtd>
            <mn>12</mn>
        </mtd>
    </mtr>
    </mtable>
</math>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions