Hi,
We are passing content in a list that is styled into a flex display. Inside the list items we have math elements rendered as svgs - however the math items do not show up.
What is very strange is that the math does show up if the list items contain other content, such as text
The attached screenshot shows the issue - Question 6 should contain 4 math expressions, Question 5 should contain 3, but the first and third do not have text, the second does. Also shown are two text blocks to show that the span itself is not the issue.
This is the html that creates question 5 currently:
these are the css settings for the list
Edit: This issue did not occur in prince 14.4
We are passing content in a list that is styled into a flex display. Inside the list items we have math elements rendered as svgs - however the math items do not show up.
What is very strange is that the math does show up if the list items contain other content, such as text
The attached screenshot shows the issue - Question 6 should contain 4 math expressions, Question 5 should contain 3, but the first and third do not have text, the second does. Also shown are two text blocks to show that the span itself is not the issue.
This is the html that creates question 5 currently:
<ul class=\"c-unstructured\">\n\t
<li><span class=\"math math-displayed\"><span class=\"mjpage\"><svg
xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"1.657ex\" height=\"3.676ex\"
style=\"vertical-align: -1.338ex;\" viewbox=\"0 -1006.6 713.6 1582.7\" role=\"img\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" aria-labelledby=\"MathJax-SVG-19-Title\">\n<title
id=\"MathJax-SVG-19-Title\">\\frac13</title>\n<g stroke=\"currentColor\" fill=\"currentColor\"
stroke-width=\"0\" transform=\"matrix(1 0 0 -1 0
0)\" aria-hidden=\"true\">\n<g
transform=\"translate(120,0)\">\n<rect stroke=\"none\" width=\"473\" height=\"60\" x=\"0\"
y=\"220\"></rect>\n <use transform=\"scale(0.707)\"
xlink:href=\"#STIXWEBMAIN-31\"
x=\"84\" y=\"628\"></use>\n <use
transform=\"scale(0.707)\" xlink:href=\"#STIXWEBMAIN-33\" x=\"84\" y=\"-598\"></use>\n</g>\n</g>
\n</svg></span></span></li>
\n\t
<li>\n<span class=\"math math-repaired\"><span class=\"mjpage\"><svg
xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"2.478ex\" height=\"3.676ex\"
style=\"vertical-align: -1.171ex;\" viewbox=\"0 -1078.4 1067.1 1582.7\" role=\"img\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" aria-labelledby=\"MathJax-SVG-20-Title\">\n<title
id=\"MathJax-SVG-20-Title\">\\frac{5}{12}</title>\n<g stroke=\"currentColor\" fill=\"currentColor\"
stroke-width=\"0\" transform=\"matrix(1 0 0 -1
0 0)\" aria-hidden=\"true\">\n<g
transform=\"translate(120,0)\">\n<rect stroke=\"none\" width=\"827\" height=\"60\" x=\"0\"
y=\"220\"></rect>\n <use transform=\"scale(0.707)\"
xlink:href=\"#STIXWEBMAIN-35\"
x=\"334\" y=\"642\"></use>\n<g
transform=\"translate(60,-423)\">\n <use transform=\"scale(0.707)\"
xlink:href=\"#STIXWEBMAIN-31\"></use>\n <use
transform=\"scale(0.707)\" xlink:href=\"#STIXWEBMAIN-32\" x=\"500\" y=\"0\"></use>\n</g>\n</g>\n</g>
\n</svg></span></span>math here
</li>
\n\t
<li><span class=\"math\"><span class=\"mjpage\"><svg xmlns:xlink=\"http://www.w3.org/1999/xlink\"
width=\"2.478ex\" height=\"3.676ex\"
style=\"vertical-align: -1.338ex;\" viewbox=\"0 -1006.6 1067.1 1582.7\" role=\"img\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" aria-labelledby=\"MathJax-SVG-21-Title\">\n<title
id=\"MathJax-SVG-21-Title\">\\frac{2}{10}</title>\n<g stroke=\"currentColor\" fill=\"currentColor\"
stroke-width=\"0\" transform=\"matrix(1 0 0 -1
0 0)\" aria-hidden=\"true\">\n<g
transform=\"translate(120,0)\">\n<rect stroke=\"none\" width=\"827\" height=\"60\" x=\"0\"
y=\"220\"></rect>\n <use transform=\"scale(0.707)\"
xlink:href=\"#STIXWEBMAIN-32\"
x=\"334\" y=\"628\"></use>\n<g
transform=\"translate(60,-423)\">\n <use transform=\"scale(0.707)\"
xlink:href=\"#STIXWEBMAIN-31\"></use>\n <use
transform=\"scale(0.707)\" xlink:href=\"#STIXWEBMAIN-30\" x=\"500\" y=\"0\"></use>\n</g>\n</g>\n</g>
\n</svg></span></span></li>
\n\t
<li>text</li>
\n\t
<li><span>text in a span</span></li>
\n
</ul>
these are the css settings for the list
.c-unstructured {
align-items: flex-start;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
margin: 0 0 1em 2em;
padding-left: 0;
}
.c-unstructured li {
list-style-type: none;
margin: 0;
padding: 0.5em 1em 0.5em 0;
text-align: left;
width: fit-content;
}
Edit: This issue did not occur in prince 14.4
Edited by Nik_Doran