How to control overlapping of select tag's options?

AlifShaikh — Tue, 17 Jul 2018 12:51:34 GMT

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.

Re: How to control overlapping of select tag's options?

RobertScheitlin__GISP — Sun, 12 Dec 2021 10:31:07 GMT

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;
}‍‍‍‍‍

topic How to control overlapping of select tag's options? in Web AppBuilder Custom Widgets Questions

How to control overlapping of select tag's options?

Re: How to control overlapping of select tag's options?