Material: autocomplete: two clear buttons are displayed

Created on 2 Jul 2018  路  2Comments  路  Source: angular/material

Bug, enhancement request, or proposal:

bug

CodePen and steps to reproduce the issue:

CodePen Demo which demonstrates the issue:

https://codepen.io/anon/pen/YvgprG?editors=1111

Detailed Reproduction Steps:

  1. click inot autocomplete's input field
  2. type aaa

What is the expected behavior?

there is single 'x' button

What is the current behavior?

there are two 'x' buttons

What is the use-case or motivation for changing an existing behavior?

desire for perfection

Which versions of AngularJS, Material, OS, and browsers are affected?

  • AngularJS: 1.5.11
  • AngularJS Material: 1.1.10
  • OS: windows
  • Browsers: IE11, not reproducible in Chrome

Is there anything else we should know? Stack Traces, Screenshots, etc.

2018-07-02 18-28-40

IE CSS

Most helpful comment

The black X on the left is inserted by the browser, not material.

Use this to globally remove them from your site:

::-ms-clear {
    display: none;
}

But if you just want to remove them from md-autocomplete, use this:

md-autocomplete ::-ms-clear {
    display: none;
}

All 2 comments

The black X on the left is inserted by the browser, not material.

Use this to globally remove them from your site:

::-ms-clear {
    display: none;
}

But if you just want to remove them from md-autocomplete, use this:

md-autocomplete ::-ms-clear {
    display: none;
}

thank you!

Was this page helpful?
0 / 5 - 0 ratings