How to avoid MultiChoice being overlapped with other widgets

Hi there,

In the code below, I defined two widgets, one is MultiChoice and the other is Select. However, when the MultiChoice is positioned upon other widgets, the options will be overlapped like this:

I have tried to position the MultiChoice to the last widget, but it’s not perfect. How to properly avoid this issue?


import panel as pn

pn.extension(template="fast")

multi_choice = pn.widgets.MultiChoice(
    name="MultiSelect", value=["Apple", "Pear"], options=["Apple", "Banana", "Pear", "Strawberry"]
)

select = pn.widgets.Select(name="Select", options=["Biology", "Chemistry", "Physics"])


multi_choice.servable(area="sidebar")
select.servable(area="sidebar")

it seems the bug in coming from fast template.
It works in material template:

import panel as pn

pn.extension(template="material")

multi_choice = pn.widgets.MultiChoice(
    name="MultiSelect", value=["Apple", "Pear"], options=["Apple", "Banana", "Pear", "Strawberry"]
)

select = pn.widgets.Select(name="Select", options=["Biology", "Chemistry", "Physics"])

pn.Column(multi_choice, select).servable(area="sidebar")

Yep, I find it also works in bootstrap template, but not works in FastGrid / FastList :<

I did observe the same problem recently as well.