Horizontally center align block latex

Anki Card Design
1

Is it possible to horizontally center align only rendered latex for those within [$$] tags but leave those within [$] tags inline?

This would make it consistent with how Anki aligns mathjax content for \( vs. \[.

I know latex content can in general be targeted with the css selector img[src*="latex"]. But that doesn’t distinguish between inline and block latex.

For example, in the screenshot below you can see that the block mathjax is center aligned, but the block latex (commutative diagram) is not.

image
image1294×700 22.5 KB

2

This code seems to work well on my end for applying styling specifically to “block LaTeX”:

.latex[alt*="displaymath"], .latex[alt*="$$"] {
    display: block; 
    margin-left: auto; 
    margin-right: auto;
}

Explanation: I checked the HTML and noticed that the alt attribute in the LaTeX images contains certain text like "displaymath" or "$$" when block LaTeX is used. The CSS uses a partial match selector ([alt*=""]) to target these cases.

While this worked in my testing, it might not cover every scenario. If needed, you can use this add-on to inspect the alt attribute and tweak the selector: AnkiWeb - AnkiWebView Inspector Add-on.

1 Like
3

@jcznk What a great addon! Exactly what I needed. Thanks for teaching a man how to fish :slight_smile:

1 Like
4

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.