Coder Social home page Coder Social logo

Comments (4)

thomaspark avatar thomaspark commented on September 8, 2024

Thanks, I updated the config option for using MathJax CDN and that cleared up the problem for me. Can you confirm equations are working for you?

http://thomaspark.co/project/pubcss/demo/acm-sig-sample-web.html
http://thomaspark.co/project/pubcss/demo/acm-sig-sample-web-theme.html

from pubcss.

JoeUX avatar JoeUX commented on September 8, 2024

Hi Thomas – Yeah, equations are rendering now in Chrome on Windows 10 and Android 6. The fourth equation in 2.6 (the long one) runs off the page in Android Chrome 50, but not in Firefox 46 for Android – it's nice and centered in Firefox, even on mobile.

Something else I noticed is that the vertical space around the equations is inconsistent across browsers. I see two distinct patterns:

  1. The space is too cramped in the Windows desktop versions of: Chrome 51, MS Edge 13, Opera 37, and Brave 0.10.0. (Opera and Brave are using Chrome's HTML engine, Blink, so their similar behavior makes sense. Edge is independent.)
  2. The space is not cramped, and looks pretty close to optimal, in: Firefox 46 for both desktop and Android, and in Chrome 50 on Android.

Which MathJax output are you using? I wonder if there are any differences between their outputs that would matter here. You might also be able to eliminate any outside server or CDN dependency by just capturing the MathJax HTML and CSS output and inserting it into the HTML file, making it static and standalone like any other document. They have a setting for that now, but I haven't dug into it. KaTex from Khan Academy also offers a static, "server-side" output feature, but I haven't played with that either. I'm amazed that either of them are able to get good equation rendering just with HTML and CSS, but that's apparently what they're doing most of the time, for newer browsers.

By the way, in this post: http://thomaspark.co/2015/01/pubcss-formatting-academic-publications-in-html-css/, your two document previews or embeds show as broken image links in Chrome 50 on Android. These are the ones after the "web version" and "interactive web paper" links in your text. (By the way, I can't see any difference between those two documents. I'm not sure what's interactive about the second one.)

Cheers,

Joe

from pubcss.

thomaspark avatar thomaspark commented on September 8, 2024

Thanks for the follow-up. The equations are written in MathML, which is supported in Prince and Firefox, but not Chrome. I prefer to use MathML, and fall back to MathJax on unsupported browsers.

I'm guessing this is the cause for the inconsistent spacing you point out between Firefox and Chrome/Edge. With some additional styles applied to the MathJax generated markup, I'm sure the spacing could be made more consistent.

The images are working for me. Not sure why they would be broken in Chrome on Android. To answer your question about the difference between the base web and interactive web papers, the base is only applying an additional "screen" stylesheet to the print version to tweak the layout. The interactive also includes JavaScript to provide features like citation tooltips and image lightboxes.

from pubcss.

7fe avatar 7fe commented on September 8, 2024

This issue seems to have resolved itself at least for me.

from pubcss.

Related Issues (18)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.