How to control overlapping of select tag's options?

3683
1
07-17-2018 05:51 AM
Labels (1)
AlifShaikh
New Contributor

Hi,

I am having a custom widget in which I have a select tag creating using dojo/select (Dropdown) whose items are filled dynamically from RDBMS. Note that I have several long length items in the dropdown. The issue I am facing is that when I click on the select tag for choosing option. The dropdown overlaps in my map div which is outside the parent widget. I expect it to be inside the parent widget. for this I have tried setting the max-width, but this is not adhered and reverts in overlapping of the select tag. Also, I have tried making use of the dojo.setStyle — The Dojo Toolkit - Reference Guide for setting the max-width. 

Wanted to know if this is an expected behaviour where the layout depends upon on the character length of the item ? Will provide the dummy sample shortly.

Any help would be appreciated.

0 Kudos
1 Reply
RobertScheitlin__GISP
MVP Emeritus

Alif,

  I kept wait for you to post your sample code... You can control the width of a selects options by adding a css rule like:

.dijitSelectLabel {
    text-align:left;
    overflow: hidden;
    width:100px;
}
0 Kudos