How do I remove all default Webkit search field styling?

by

Try these stylings:

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance:none;
}

Source: http://css-tricks.com/webkit-html5-search-inputs/#comment-82432

More Related Contents:

  1. How to remove the border highlight on an input text element
  2. How to style HTML5 range input to have different color before and after slider?
  3. Chrome / Safari not filling 100% height of flex parent
  4. How to remove focus border (outline) around text/input boxes? (Chrome) [duplicate]
  5. Custom CSS Scrollbar for Firefox
  6. Matching an empty input box using CSS
  7. What is WebKit and how is it related to CSS?
  8. Preventing scroll bars from being hidden for MacOS trackpad users in WebKit/Blink
  9. Disable webkit’s spin buttons on input type=”number”?
  10. CSS transition shorthand with multiple properties?
  11. WebKit: Blurry text with css scale + translate3d
  12. Fixed element disappears in Chrome
  13. CSS endless rotation animation
  14. How to prevent Webkit text rendering change during CSS transition
  15. Webkit CSS to control the box around the color in an input[type=color]?
  16. CSS Input with width: 100% goes outside parent’s bound
  17. Webkit backface visibility not working
  18. Is it possible to always show up/down arrows for input “number”?
  19. How to force re-render after a WebKit 3D transform in Safari
  20. What is the correct “-moz-appearance” value to hide dropdown arrow of a element
  21. Why does stacking order change on webkit filter hover?
  22. CSS3 property webkit-overflow-scrolling:touch ERROR
  23. Safari/Chrome (Webkit) – Cannot hide iframe vertical scrollbar
  24. CSS “outline” different behavior behavior on Webkit & Gecko
  25. Hide Up & Down Arrow Buttons (Spinner) in Input Number – Firefox 29
  26. Wonky text anti-aliasing when rotating with webkit-transform in Chrome
  27. WebKit CSS content Unicode bug?
  28. Apply webkit scrollbar style to specified element
  29. Image scaling by CSS: is there a webkit alternative for -moz-crisp-edges?
  30. using a div to blur an image behind it? [duplicate]

Leave a Comment