0

simple question, if I have a select-option structure like this:

<select class="productIDSelector" id="productID" name="productID" [(ngModel)]="productId">
      <option *ngFor="let item of products" [value]="item.productID" class="optionList">
        <p class="idList"> {{ item.productID }}: </p>
        <p class="descList"> {{item.description}} </p>
      </option>
</select>

Is it possible to style the dropdown and it's components?

I can change the input-field to my liking, but I'd like the listed options to be styled as well and if possible have the dropdown open downward (it's a lot of data, so it always opens upwards).

Would that be possible? Preferably with html/css only.

Edit: As this was marked as dublicate:

I flew over the linked question (lots to read) and from what it felt like to me, it was aimed at styling mostly the input-box part of the select-dropdown.

To avoid any possible misunderstandings:

enter image description here

If I misunderstood the linked question or missed the important part in it, feel free to point it out to me

m41n
  • 403
  • 1
  • 5
  • 16
  • 3
    Possible duplicate of [How to style a – atmd Aug 09 '17 at 13:34
  • I might be wrong, but that question seemed to mostly focus on the input box of the select, not the dropdown part. – m41n Aug 09 '17 at 14:20
  • Here is perhaps a more relevant duplicate: https://stackoverflow.com/questions/8430279/how-to-style-the-option-with-only-css. The TLDR there is that there isn't a way to do it. – cjl750 Aug 09 '17 at 17:09
  • So it's either javascript or nothing? – m41n Aug 10 '17 at 05:48

0 Answers0