I'm having trouble troubleshooting an issue on provemath where the content is not rendering as desired.
The problem is that each line (except for the first) in written content is wrapped in a <div>. For example, the content
line1.
line2.
as you can see through the Safari web inspector is actually rendered as <p>line1.<div>line2.</div></p>. The DESIRED output is <p>line1.<br>line2.</p>.
There are a few things that could be coming into play here...
- I'm not sure how the browser takes in typed newlines.
- My content rendering function (included below) runs Markdown (actually, marked) and some regexs.
- CSS (included below) manipulates how some things are displayed, and I'm wondering if it can cause changes in the HTML itself. I previously thought the use of
flexboxwas causing this, but I changed the CSS to no avail.
Content rendering happens as follows:
Content is typed by user (hitting RETURN for a new line) and captured with jQuery's .html function
blind.value = $value.html()
to get the content, and then processed with
function render_content(string) {
// make all \ into \\ instead, so that they will be \ again when marked is done. This is for MathJax postrender compatability.
string = string.replace(/\\/g, '\\\\')
string = string.replace(/\n/g, '<br />') // not doing anything AFAIK
string = marked(string)
string = string.replace(/img(\d+)/g, '<img src="image/$1.jpg" />')
string = string.replace(/\\includegraphics\{(.*?)\}/g, '<img src="image/$1.jpg" />')
return string
}
The CSS is as follows:
.value {
// display: inline-flex;
display: inline;
// flex-direction: column;
vertical-align: top;
width: 85%;
}
you can see the old CSS commented out.