Comments on: appearance

By: Roger

Roger — Sun, 01 Nov 2020 12:42:35 +0000

any body know how to remove the small cross button on the search bar? It seem generated by Chrome.

Chrome 86.0.4240.111
macOS 10.14

By: Guo Yunhe

Guo Yunhe — Thu, 03 Oct 2019 11:44:40 +0000

Opera supports it now. https://caniuse.com/#feat=css-appearance

By: lucifer164

lucifer164 — Tue, 27 Nov 2018 11:11:36 +0000

In reply to Doug. It works for me ^^. Thank you very much :D

By: Khánh

Khánh — Fri, 09 Feb 2018 08:02:31 +0000

In reply to Doug. Great, Thanks u so much!!!

By: Mottie

Mottie — Sun, 24 Dec 2017 18:26:11 +0000

Please update the list. There is no reference to: -moz-appearance: checkbox-small; -moz-appearance: dialog; -moz-appearance: radio-small; -moz-appearance: scrollbar; -moz-appearance: tab-left-edge Obsolete; -moz-appearance: window; And there are a ton of missing properties. Too many for me to list out here. See the offical MDN docs

By: Noor

Noor — Mon, 13 Mar 2017 03:32:37 +0000

In reply to Doug. Works good. Thanks!

By: Arnout

Arnout — Fri, 24 Feb 2017 10:17:07 +0000

The default appearance is supported in IE Edge (v12+)

By: Anwar

Anwar — Mon, 20 Jun 2016 15:22:02 +0000

What are peoples’ thoughts on:

form {
  * {
     appearance: none;
  }
}

On another note; it pleases me very much that CSS Tricks show up more and more often as the top Google/DuckDuckGo result.

I happened on this page searching for ‘appearance none’

FTW

By: Michael

Michael — Thu, 03 Dec 2015 21:16:11 +0000

In reply to Doug. Fantastic! This was the missing piece of the puzzle for me!

By: Doug

Doug — Fri, 30 Oct 2015 16:44:09 +0000

Joao Cunha’s link was great, he also added a fix for Internet Explorer. The most current answer:

select {
-webkit-appearance: none;
-moz-appearance: none;
}

select::-ms-expand {
display: none;
}

By: Nathan

Nathan — Sun, 03 May 2015 21:44:18 +0000

Hey Chris, just wanted to let you know that you’ve got a link to https://css-tricks.com/7261-webkit-html5-search-inputs/ up there where you talk about Safari search inputs, which is a 404. Feel free to delete this comment, just thought it’d be the easiest way to get this to you.

By: Bob

Bob — Thu, 02 Apr 2015 19:58:01 +0000

On iPad 3 with iOS 8 in Safari it doesn’t work.

By: Peter

Peter — Tue, 24 Feb 2015 09:03:16 +0000

In reply to Craig Reville. I'd just force redirect the IE users to the chrome/safari download page

By: Brian

Brian — Tue, 20 Jan 2015 05:14:03 +0000

none of the solutions provided work for me, anyone else have an idea how to hide the select arrow on firefox for android?

By: jul

jul — Wed, 24 Dec 2014 11:24:35 +0000

In reply to João Cunha.

Yep, this doesn’t work.
Using Firefox 34.0.5, opening the example in codepen, the arrow is still there.

Since I was using a background image for different arrows, what I’m doing now is using this way of targeting Firefox (thx nathansmith):
https://gist.github.com/joaocunha/6273016/#comment-944635
to remove my custom background image and just leave the default arrow. Works & doesn’t appear broken = compatible :)