Select Drop Down Height

[swim4serio]

I am creating a form utilizing CSS and the jquery transfom plugin. I have a few drop down boxes that I would like to modify the height because the setting I have currently adds white space under the few options I have. What is the best way to code this into my form?

[TheDoc]

Do you have an example you can put on Codepen?

[swim4serio]

It comes out swell on code pen, this is where I am lost. The url of my form is here. New Assignment Request. It is based off the code for the Website Change Request Form. If you look at my page, the Assignment type looks fine because there are enough options to fill the box, however, the Type of Loss only has 3 options and there is white space underneath.

[mikewax]

You can always adjust the height of the DropDown in the CSS.

dropdown {
height: /enter height in/
}

Or you can use an ID to identify each one. Or you can adjust the margin of the options in the dropdown.

Does this help?

[TheDoc]

Why don’t you just remove the height completely and let it be as tall as the content?

[Martin Duran]

I agree with the TheDoc. You have a height set on:

.jqTransformSelectWrapper ul {}

which is creating the white space you see. Give it height auto, or don’t define a height at all, and you won’t see that white space anymore.

[swim4serio]

TheDoc, that did resolve the issue. Removing the height allowed each drop down to adhere to the number of options.

mikewax, I’m going to give that a try once I place my drop down for state selection to try and limit the height of those.

Thanks to all for your feedback! I’m new to this forum and am excited with the collaboration potential for troubleshooting.

[Author]

Posts