# Render LaTeX left aligned

**URL:** <https://discourse.julialang.org/t/render-latex-left-aligned/112251>\
**Category:** Pluto\
**Created:** [March 28, 2024, 8:25pm UTC](https://discourse.julialang.org/t/render-latex-left-aligned/112251 "2024-03-28T20:25:15Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![co1emi11er](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/co1emi11er/32/206849_2.png) [@co1emi11er](https://discourse.julialang.org/u/co1emi11er)\
**Post date:** [March 28, 2024, 8:25pm UTC](https://discourse.julialang.org/t/render-latex-left-aligned/112251/1 "2024-03-28T20:25:15Z")

</div>

Is there a way I can get the LaTeX to render as left aligned instead of at the center of the page in Pluto?

 ![image](https://global.discourse-cdn.com/julialang/original/3X/b/f/bf80013a36d4c3a5fb5bf71349ce9cb450e7f420.png)

---

<div class="post-metadata">

**Author:** ![stevengj](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/stevengj/32/71_2.png) [@stevengj](https://discourse.julialang.org/u/stevengj)\
**Post date:** [March 29, 2024, 12:19am UTC](https://discourse.julialang.org/t/render-latex-left-aligned/112251/2 "2024-03-29T00:19:29Z")

</div>

Embed the latex equations in markdown text?

---

<div class="post-metadata">

**Author:** ![co1emi11er](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/co1emi11er/32/206849_2.png) [@co1emi11er](https://discourse.julialang.org/u/co1emi11er)\
**Post date:** [March 29, 2024, 12:44am UTC](https://discourse.julialang.org/t/render-latex-left-aligned/112251/3 "2024-03-29T00:44:34Z")

</div>

Well that wouldn’t be a very useful option. I am trying to maybe use Pluto for professional calc packages and having to rewrite the equations would kind of end the reasoning on using it. I can maybe deal with center-alignment but I am used to things being left aligned (and mostly everyone here at the company as well). Here is what is returned that gets automatically rendered in pluto and jupyter. Only in jupyter, it is left aligned.

## Pluto

 ![image](https://global.discourse-cdn.com/julialang/original/3X/3/2/32831c33910ebb22e387ccf66e2fc93b57878a83.png)

## Jupyter

 ![image](https://global.discourse-cdn.com/julialang/original/3X/8/1/819ab743cae8de35c9242202f535c6a8cc296a4e.png)

Do you know if getting it to render as left aligned is possible in Pluto?

---

<div class="post-metadata">

**Author:** ![abraemer](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/abraemer/32/51403_2.png) [@abraemer](https://discourse.julialang.org/u/abraemer)\
**Post date:** [March 29, 2024, 7:36am UTC](https://discourse.julialang.org/t/render-latex-left-aligned/112251/4 "2024-03-29T07:36:43Z")

</div>

Well I think Pluto output cells center their content by default. In principle it is very easy to customize the look of Pluto because it’s just some CSS and you can actually add to that by writing CSS into a cell and executing it (which I don’t really understand how it works but it’s amazing). So if you are fine with all result cells being left-aligned (not just LaTeX) then you can probably fiddle the CSS 🙂

For that you need to poke around the HTML a bit using Developer Tools (F12 in Firefox/Chrome), play a bit with the styles and if you found something that works for you, you can put it in a cell like

```julia
html"""
<style>
/* Your customization here */
</style>
"""

```

---

<div class="post-metadata">

**Author:** ![disberd](https://avatars.discourse-cdn.com/v4/letter/d/8edcca/32.png) [@disberd](https://discourse.julialang.org/u/disberd)\
**Post date:** [March 31, 2024, 4:34pm UTC](https://discourse.julialang.org/t/render-latex-left-aligned/112251/5 "2024-03-31T16:34:17Z")

</div>

Indeed as @abraemer suggested CSS is the way to go here.  
You could override the display of all mathjax in your current notebook with the following style:

```julia
html"""
<style>
	mjx-container {
		text-align: left !important;
	}
</style>
"""

```

 ![image](https://global.discourse-cdn.com/julialang/original/3X/b/5/b50cd3d1208b61472fb3179dea15cb5667b42a13.png)

To have something more custom just for handcalcs you could create a custom struct wrapper around the `LaTeXString` struct that has a custom show method for `MIME"text/html"` that gives a specific class (as example) to your custom struct when shown within Pluto.

For this you could use as example [`AbstractPlutoDingetjes.is_inside_pluto(io::IO)`](https://github.com/JuliaPluto/AbstractPlutoDingetjes.jl/blob/a2cc8e19a2168402ef4f2d6dc3cc4b95a22167d1/src/AbstractPlutoDingetjes.jl#L106-L119) which has exactly that as one of its use cases

---

<div class="post-metadata">

**Author:** ![co1emi11er](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/co1emi11er/32/206849_2.png) [@co1emi11er](https://discourse.julialang.org/u/co1emi11er)\
**Post date:** [March 31, 2024, 5:29pm UTC](https://discourse.julialang.org/t/render-latex-left-aligned/112251/6 "2024-03-31T17:29:47Z")

</div>

This is great! Thanks!

I will experiment with both!

---

<div class="post-metadata">

**Author:** ![co1emi11er](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/co1emi11er/32/206849_2.png) [@co1emi11er](https://discourse.julialang.org/u/co1emi11er)\
**Post date:** [April 1, 2024, 6:16pm UTC](https://discourse.julialang.org/t/render-latex-left-aligned/112251/7 "2024-04-01T18:16:25Z")

</div>

How did you get html syntax highlighting (shown below) in pluto?

![image](https://global.discourse-cdn.com/julialang/original/3X/e/8/e8d34c2bf0250c1a350c1679de6728fca5a79501.png)

---

<div class="post-metadata">

**Author:** ![disberd](https://avatars.discourse-cdn.com/v4/letter/d/8edcca/32.png) [@disberd](https://discourse.julialang.org/u/disberd)\
**Post date:** [April 2, 2024, 7:47am UTC](https://discourse.julialang.org/t/render-latex-left-aligned/112251/8 "2024-04-02T07:47:20Z")

</div>

It’s a hidden experimental feature that is not (anymore) on by default as it has performance issues in some cases.

You can enable it by opening the developer console in the browser while inside a Pluto notebook and type `PLUTO_ENABLE_CM_MIXED_PARSER()` to toggle it.  
It is stored in the browser local cache so once you activate it, it will remain active on the same domain (e.g. `localhost:1234`) even when closing and reopening browser or pluto server and until you deactivate it with the same command.

You can read something more about the issues that made it not enabled by default here

> <https://github.com/fonsp/Pluto.jl/issues/1893#issuecomment-2030850758>
>
> My computer was really slow today, and CM6 became glitchy inside JS. I think tha…t CM6 is not using the incremental parse system inside the submodes, only in Julia.
> 
> These videos were taken in a really big notebook (https://github.com/ClimateMARGO/interactive) with 6x CPU slowdown (chrome devtools), which is similar to how it felt before rebooting :)
> 
> \# JS
> 
> https://user-images.githubusercontent.com/6933510/152447878-6a60e1d3-b231-498f-9e9b-8f62fcc29cad.mov
> 
> \# Julia
> 
> https://user-images.githubusercontent.com/6933510/152447922-100f2d08-6232-4cc6-a0f9-d6b48b4b7f81.mov