0

I'm using a lightning-combobox and I have it inside a div section with slds-scrollable.

<template>
<div class="slds-box slds-scrollable">
<lightning-combobox
        name="progress"
        label="Status"
        value={value}
        placeholder="Select Progress"
        options={options}
        onchange={handleChange} ></lightning-combobox>

<p>Selected value is: {value}</p>
</div>

What's happening is when I click a drop down they go inside scrollable div context and I'm trying to display on top of scrollable div any solution please I tried z-index: huge number and didn't work.

Click here to see in playground.

Screenshots : Left is with scrollable and right is without scrollable

Left is with scrollable and right is without scrollable

I need a scroll bar but combobox menu should show on top of all elements.

Improve this question
7
  • why do you even want scrollable on combobox?
    – salesforce-sas
    Jun 12, 2020 at 22:15
  • Hi @Salesforce-sas thanks for reply actually its in a custom table and the whole table is inside a div which have slds-scrollable. Just to drill down to problem I have written question like that, please note if I remove scrollable it works but I need that property too
    – vkm
    Jun 12, 2020 at 22:22
  • Scrollable scopes the DOM in it. There is no work-around for this
    – salesforce-sas
    Jun 12, 2020 at 22:23
  • Even style="overflow: auto" does the same, I read about z-index which works but not in Salesforce I tried a lot.
    – vkm
    Jun 12, 2020 at 22:26
  • Even z-index does not help when you add scrollbars. Z-index is for giving priority but scrollable just scopes the DOM inside it, so nothing we can do about it
    – salesforce-sas
    Jun 12, 2020 at 22:28

1 Answer 1

Reset to default
1

Found a way we can use style="position:absolute" but need to be careful with the position as it might cause to overlap. Please check here

Improve this answer
2
  • 2
    you are positioning it w.r.t window and thats why u r feeling its working. Check this. When you position it w.r.t its immediate parent, it will start failing again. This is not workable solution.
    – salesforce-sas
    Jun 17, 2020 at 9:33
  • @salesforce-sas yes agreed. Just workaround, in case you find something please do let know.
    – vkm
    Jun 17, 2020 at 9:36

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .