Skip to content

Instantly share code, notes, and snippets.

@eirikbacker

eirikbacker/search-icon.css

Created June 17, 2018 12:27
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save eirikbacker/5f20fde909307882105d5a543fdec70a to your computer and use it in GitHub Desktop.
Save eirikbacker/5f20fde909307882105d5a543fdec70a to your computer and use it in GitHub Desktop.
Download ZIP
Single element search icon CSS - when you can not change the markup and want to make a icon out of <input type="submit">
Raw
search-icon.css
.search-submit { /* Single element search icon, no pseudo elements */
width: 15px;
height: 15px;
border: 2px solid; /* Not specifying color means border + box-shaddow gets currentColor (font color) */
border-radius: 100%;
box-shadow: 6px 6px 0 -6px, 7px 7px 0 -6px;
background: none;
color: inherit;
font-size: 0; /* Hide text */
padding: 0;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment