Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

change ng-dropdown panel height

See original GitHub issue

Hi. I have customize my option style like this:

.ng-select.ng-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option {
    border-top: 1px solid grey;
}

After than, ng-dropdown-panel always contain scrollbar, you can see that on the screenshot below.

I found this function _measureDimensions in NgDropdownPanelComponent, and this line of code const optionHeight = option.clientHeight;

Is there possible to replace option.clientHeight to option.offsetHeight for more correct options height calculate?

screenshots:

how it looks now

what expect

Issue Analytics

State:
Created 3 years ago
Comments:7

Top GitHub Comments

2reactions

github-actions[bot]commented, Aug 29, 2020

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions 🎆

0reactions

Beloucciocommented, Feb 10, 2021

why closed?

Top Results From Across the Web

Want to increase height of ngSelect options - Stack Overflow

You have to use /deep/ more the component that you want change. /deep/ .ng-dropdown-panel .ng-dropdown-panel-items { max-height: 500px; }.

Adjust the size of the dropdown menu · Issue #939 · ng-select ...

Describe the bug I´d like to adjust the width of dropdown. The dropdown menu has the same width of his parent. Reproducbile example....

ngSelect Customizations: Draggable Panel - ActiveLAMP

Today I'm writing about how I made the ng-select dropdown resize by dragging the dropdown box wider. If you want to follow along...

@ng-select/ng-select - npm

Angular ng -select - All in One UI Select, Multiselect and Autocomplete. ... Start using @ng-select/ng-select in your project by running `npm ...

Angular (forked) - StackBlitz

ng -select example. ... height: 100px;. border: 1px solid #999;. overflow: hidden; ... ::ng-deep .scrollable-box ng-dropdown-panel {. margin-top: -20px;. }.