ng2-ui / auto-complete

Angular Auto Complete component and directive
https://ng2-ui.github.io/dist/#/auto-complete
MIT License
279 stars 123 forks source link

how do i set z-index of list? #260

Closed RawatPraveen closed 7 years ago

RawatPraveen commented 7 years ago

I want to set z-index of the list which has z-index as 1 by default. How do i do it?

pawelchmara commented 7 years ago

You can add this to your css:

ngui-auto-complete {
  z-index: 100 !important;
}
renanmoraes commented 7 years ago

dont work for me :(

RawatPraveen commented 7 years ago

@pawelchmara are u sure that this worked for you as i have tried it and it didn't worked.

pawelchmara commented 7 years ago

Yes, it works. Where are you put this css rule (in global stylesheet or in component stylesheet)? Maybe z-index value should be greater...

As you can see below in my case, the z-index value has been overwritten correctly:

image

RawatPraveen commented 7 years ago

@pawelchmara i have added this css in my style.css file and there it did not worked. I will try wtih component css.

allenhwkim commented 7 years ago

@pawelchmara your css rule goes into your component with encapsulation strategy encapsulation: ViewEncapsulation.None, e.g. appComponent, parentComponent, etc.. e.g., http://plnkr.co/edit/3pB1Gx?p=preview

RawatPraveen commented 7 years ago

Its fixed with that trick. Thanks

adamwe499 commented 6 years ago

@RawatPraveen, You should install z-index direct to template . It's work fine. <input class="form-control" auto-complete [source]="Aerodromes" z-index="5" /> It is more right than to change encapsulation mode