Annotation font size limited to px ? Is there a trick to switch to "pt" ? What about border bottom and other CSS styles?

Hello,
I’m adding a lot of annotations on my charts; I’ld like to know whether there is a simple way to add a bottom border to an annotation, without adding an horizontal shape below the annotation,
And also, if there could be a way to define the size of these annotation in “pt”, rather than “px”.

I’m designing “slides”, as I would with powerpoint, but with Dash. I like the fact that I can accurately position every elements on my page exactly where I want it to be.
Often, there is a title at the top of the page.
And another title H2 below.
It often happen that I have 2 or 3 subplot on the same figure, this way I am sure that all my axes and domain are always perfectly aligned.

But, if I need to replicate the style of a H2 HTML.Div(), positionned above the dcc.Graph,
to an annotation inside the plotting or paper area, I’m quite limited in terms of finetuning.

The alternative would consist in adding a html.Div() with relative positionning above (i mean here above as on top, higher Z-index) the dcc.Graph, but that’s a bit messy.

If these annotation could get a class or be treated as html element, it would be either. However, there are SVG text element, and as far as I know, it is not possible to target SVG text elements with CSS. Am I wrong on that ?

KR

Hello @David22,

I’d suggest you try adjusting the annotation in the browser style panel, and if it takes, then create a css stylesheet that targets your specific use-case.

I’m pretty sure it will work. If you need to override inline styling, you can always append !important to the css property you want to take over.