Page 1 of 1

Dropdown is not being rendered correctly

Posted: 09 Jun 2021, 23:15
by joshconzer320
I'm trying to show Dropdown but it's not being rendered correctly. Please see the attached image.Image

Re: Dropdown is not being rendered correctly

Posted: 11 Jun 2021, 15:52
by tugce.kucukoglu
Unfortunately, the image is not showing so unable to replicate. But you find codesandbox example on the documentation.

Re: Dropdown is not being rendered correctly

Posted: 28 Jun 2021, 18:32
by Ximix
I don't know what problem the original author of this topic had, but I too have strange display errors with dropdown and multiselect. The error only occurs on some pages, not all. I have not found a connection yet. In case it doesn't work with the image either. The dropdown area is not positioned correctly under the field, but about 5 pixels too far to the left. Also the width is too small (about 15 pixels too little)

Image

Re: Dropdown is not being rendered correctly

Posted: 04 Jul 2021, 11:26
by jadox13597
Hi, I'm having the same issue, but I found out the fix, you need to add appendTo props with the value of "self" instead of the default "body" to your dropdown component, like this

Code: Select all

<Dropdown v-model="selectedCity" :options="cities" appendTo="self" />
Hope it helps :D

Re: Dropdown is not being rendered correctly

Posted: 05 Jul 2021, 09:52
by Ximix
jadox13597 wrote:
04 Jul 2021, 11:26
Hi, I'm having the same issue, but I found out the fix, you need to add appendTo props with the value of "self" instead of the default "body" to your dropdown component, like this
This worked for me. Thanks a lot!