jupyter-widgets / ipywidgets

Interactive Widgets for the Jupyter Notebook
https://ipywidgets.readthedocs.io
BSD 3-Clause "New" or "Revised" License
3.14k stars 949 forks source link

The width of ipw.HTMLMath is too small, when there is an ordinal text after equation #3187

Open sindzicat opened 3 years ago

sindzicat commented 3 years ago

If there is some text after equation, the width of output from ipw.HTMLMath is too short...

image

JupyterLab 3.0.14

pip freeze output
anyio==2.2.0
argon2-cffi==20.1.0
async-generator==1.10
attrs==20.3.0
Babel==2.9.0
backcall==0.2.0
bleach==3.3.0
certifi==2020.12.5
cffi==1.14.5
chardet==4.0.0
colorama==0.4.4
decorator==5.0.7
defusedxml==0.7.1
deprecation==2.1.0
entrypoints==0.3
idna==2.10
ipykernel==5.5.3
ipython==7.22.0
ipython-genutils==0.2.0
ipywidgets==7.6.3
jedi==0.18.0
Jinja2==2.11.3
json5==0.9.5
jsonschema==3.2.0
jupyter-client==6.1.12
jupyter-core==4.7.1
jupyter-packaging==0.9.2
jupyter-server==1.6.4
jupyterlab==3.0.14
jupyterlab-pygments==0.1.2
jupyterlab-server==2.4.0
jupyterlab-widgets==1.0.0
MarkupSafe==1.1.1
mistune==0.8.4
nbclassic==0.2.7
nbclient==0.5.3
nbconvert==6.0.7
nbformat==5.1.3
nest-asyncio==1.5.1
notebook==6.3.0
packaging==20.9
pandocfilters==1.4.3
parso==0.8.2
pickleshare==0.7.5
prometheus-client==0.10.1
prompt-toolkit==3.0.18
pycparser==2.20
Pygments==2.8.1
pyparsing==2.4.7
pyrsistent==0.17.3
python-dateutil==2.8.1
pytz==2021.1
pywin32==300
pywinpty==0.5.7
pyzmq==22.0.3
requests==2.25.1
Send2Trash==1.5.0
six==1.15.0
sniffio==1.2.0
terminado==0.9.4
testpath==0.4.4
tomlkit==0.7.0
tornado==6.1
traitlets==5.0.5
urllib3==1.26.4
wcwidth==0.2.5
webencodings==0.5.1
widgetsnbextension==3.5.1
sindzicat commented 3 years ago

Temporary workaround:

image

import ipywidgets as ipw
from IPython.display import HTML, display

%%html
<style>
.text-after-eq {
    left: -5px;
}
</style>

h1 = ipw.HTMLMath('$\sin(x^2) + \sum_{n=0}^\infty \left ( \cfrac{1}{n} \\right )$')

h2 = ipw.HTML(', мм',layout=ipw.Layout(align_self='center'))
h2.add_class('text-after-eq')

ipw.HBox([
    h1,
    h2
])

HTML('$\sin(x^2) + \sum_{n=0}^\infty \left ( \cfrac{1}{n} \\right )$, мм')