Custom CSS Styles

[chasevis]

Hello, First of all Thank you for your effort on this fork. I am trying to change the height of the .ngx-select__selected class but having no luck with that.

Any Help is appreciated

Thank you

[optimistex]

@chasevis Probably you need to change ngx-select__toggle

[chasevis]

@optimistex Thank you for you reply i tried ngx-select__toggle ,it is working in chrome. but when i change it in .css file . it is not being applied.

[optimistex]

Try to add !important: .ngx-select__toggle{height: 65px !important}

[chasevis]

no luck

[optimistex]

@chasevis Show your code. Probably you do not included your css or something like this? Try to change a colour to be sure that the css is included and works.

[chasevis]

<ngx-select [items]="customerdata" [allowClear]="true" [(ngModel)]="customer" name="customer" (typed)="Search($event)"> </ngx-select>

.ngx-select__toggle { height: 27px !important; }

css is included in the component , can apply css to other blocks

[optimistex]

@chasevis The example: https://stackblitz.com/edit/ngx-select-ex-issues-136?file=app/app.component.ts

You should use /deep/ if you make own css in a component. But, /deep/ has deprecated....

[guntram]

You should use /deep/ if you make own css in a component. But, /deep/ has deprecated....

You can use encapsulation in the Component annotation:

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss'],
  // ViewEncapsulation.None is the equivalent for /deep/
  encapsulation: ViewEncapsulation.None,
})