How to align center horizontally and vertically

In Panel I often try to center panes, text and images. I haven’t really figured out how it works yet. I have tried to study the documentation for example here

https://panel.pyviz.org/user_guide/Customization.html

But it only talks a little bit about it wrt. spacers.

Would it be an idea to a lot of examples to the documentation? I think it’s something basic that a lot of users would try to achieve.

Is it really true that in order to center a HTML pane called spinner that I need to do?

spinner = pnx.spinners.Facebook()

page = pn.Column(
    pn.layout.VSpacer(),
    pn.Row(pn.layout.HSpacer(), spinner, pn.layout.HSpacer(), height=64,),
    pn.layout.VSpacer(),
    width=400,
    height=400,
    background="gray",
)

A slightly simpler version:

spinner = pn.widgets.Progress(align='center')

vpage = pn.Column(
    pn.layout.VSpacer(),
    spinner,
    pn.layout.VSpacer(),
    width=400,
    height=400,
    background="gray",
)
1 Like