Skip to content

Automatic linebreaks + max-width + table, unexpected behavior #571

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
ghost opened this issue Sep 14, 2013 · 1 comment
Open

Automatic linebreaks + max-width + table, unexpected behavior #571

ghost opened this issue Sep 14, 2013 · 1 comment
Labels
Accepted Issue has been reproduced by MathJax team

Comments

@ghost
Copy link

ghost commented Sep 14, 2013

Tested with firefox and chrome, using the latest mathjax from the cdn.

Config:

MathJax.Hub.Config({
"HTML-CSS": { linebreaks: { automatic: true }, width: 'container' },
SVG: { linebreaks: { automatic: true } }
});

  1. Put a math element inside a div with max-width - auto linebreak works.
  2. Put the same div element inside a table cell - auto linebreak does not work. (It does work if max-width is replaced with width).
  3. Put a long text line inside the div together with the math - auto linebreak works again.

Examples

    <div class='test' style='max-width: 220px; background: #aaa;'>
        <math display='inline' indentalign='left'
            xmlns='http://www.w3.org/1998/Math/MathML'>
            <mn>8.484301322621956</mn>
            <mo>+</mo>
            <mn>-9.96326680337424</mn>
            <mo>+</mo>
            <mn>0.5776307876254698</mn>
            <mo>+</mo>
            <mn>0.7560610719077764</mn>
            <mo>+</mo>
            <mn>19.07127127805585</mn>
        </math>
    </div>
    <table>
        <tr>
            <td>
                <div class='test' style='max-width: 220px; background: #aaa;'>

                    <math display='inline' indentalign='left'
                        xmlns='http://www.w3.org/1998/Math/MathML'>
                        <mn>8.484301322621956</mn>
                        <mo>+</mo>
                        <mn>-9.96326680337424</mn>
                        <mo>+</mo>
                        <mn>0.5776307876254698</mn>
                        <mo>+</mo>
                        <mn>0.7560610719077764</mn>
                        <mo>+</mo>
                        <mn>19.07127127805585</mn>
                    </math>
                </div>
            </td>
        </tr>
    </table>
    <table>
        <tr>
            <td>
                <div class='test' style='max-width: 220px; background: #aaa;'>

                    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor 

                    <math display='inline' indentalign='left'
                        xmlns='http://www.w3.org/1998/Math/MathML'>
                        <mn>8.484301322621956</mn>
                        <mo>+</mo>
                        <mn>-9.96326680337424</mn>
                        <mo>+</mo>
                        <mn>0.5776307876254698</mn>
                        <mo>+</mo>
                        <mn>0.7560610719077764</mn>
                        <mo>+</mo>
                        <mn>19.07127127805585</mn>
                    </math>
                </div>
            </td>
        </tr>
    </table>
@dpvc
Copy link
Member

dpvc commented Dec 16, 2013

MathJax's detection of the line width in your case 2 is returning a value that is way too small. I'll have to check into it further.

@pkra pkra modified the milestone: Next Release Aug 23, 2014
@pkra pkra self-assigned this Aug 24, 2014
@pkra pkra removed their assignment Feb 26, 2015
@pkra pkra removed the Investigate label Apr 15, 2015
@pkra pkra added this to the A future release milestone Apr 15, 2015
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Accepted Issue has been reproduced by MathJax team
Projects
None yet
Development

No branches or pull requests

2 participants