How to center a HTML Jupyter widget

[tolliob]

Hi everybody,

I want to center a bold text in a Jupyter widget. To write bold text, I naturally use the HTML widget. Then, I want to center it using the layout properties.

I’ve try the following codes, but none of them is centering my text…

widgets.HTML(value="<b>text</b>",
             layout=Layout(display='flex' ,
                           justify_content='center',
                           border='solid 1px black'
                          ),
            )

as well as

widgets.HTML(value="<b>text</b>",
             style={'description_width': 'initial'},
             layout=Layout(object_position='center',
                           border='solid 1px black'
                          )
            )

Here is the render of this two pieces of code:

I must admit that, as always with css or equivalent, I’m totally confused…

Thank for your help,

N.B.: The border property is just to check if the bold text is centered, or not…

[tolliob]

I’ve found a solution:

widgets.HTML(value='<b><p style="text-align:center">Centered text</p></b>',
             layout=Layout(border='solid 1px black')
            )