The css in the starterkit attempts to render its own arrow indicators on select elements. This tries to use appearance: none; to hide the browser indicators, but this has no effect in Chrome, Firefox or IE. You can add vendor prefixes for Chrome and Firefox, but not IE.

Bootstrap 4 has a custom select pattern that seems to work in IE. See http://v4-alpha.getbootstrap.com/components/forms/#select-menu.

Can we try and replicate that instead?

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

mstrelan created an issue. See original summary.

mstrelan’s picture

Status: Active » Needs review
FileSize
489 bytes

Looking in to Bootstrap v4 and found that it uses this for IE:

select::-ms-expand {
  opacity: 0;
}

Patch attached.

  • markcarver committed f8954a9 on 8.x-3.x authored by mstrelan
    Issue #2758981 by mstrelan: Select elements have duplicate arrows
    
markhalliwell’s picture

Status: Needs review » Fixed

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.