2992_97298650298_564045298_2497552_3413015_n

CSS Inputs Boxes - No images (Webkit only)

by Ryan Rumsey Pro Apr 18, 2010
in webkit
Shot_1271642352
Tweet
751 views
http://drbl.in/gdP
Icon-colordrop

Tags

  1. 5
  2. 2
  3. 2
  4. 1
  5. 1
  6. 1
  7. 1
  8. 1
  9. 1
  10. 1
  11. 1
  12. 1

1 Response

  1. Pro 2992_97298650298_564045298_2497552_3413015_n Ryan Rumsey

    Just wanted to do some testing of input boxes with CSS. While the webkit default styles are brilliant, there are some rules to them. Namely, input[type=search] and text indentation. I wanted to see if I could re-create the webkit inputs, but give myself some flexibility as to how they operate. These are all created with the help of webkit styles like border-radius, gradient, box shadow, and appearance. Everything you see is custom CSS, including the focus outlines.

    Versions include input with rounded corners, inputs with a select dropdowns and their hover/focus states.

    about 2 years ago

Ads via The Deck

More by Ryan Rumsey

More In webkit

keyboard shortcuts: ← previous shot → next shot L or F like