A very cool and a very long search bar created by Dan Eden. It uses an extra p tag to style the search bar (and the search icon) perfectly.
It's purely CSS3 and no images are used. Also, it has very lovely hover and active states. Just a sprinkle of jQuery can bring this search bar to life!
Submissions are most welcome! Also Share your feedbacks (using the feedback button on the right) and help us improve.
A Collection of Pure CSS Creations! Let's form a big collection of items built with pure CSS and HTML and help frontend coders realize the power and flexibility of CSS. Hopefully the creations will help them get better at the new features of CSS (and in general too) and they'll start making more use of it in their projects :)
Lots of new exciting features coming soon! Stay Tuned.
Add New Comment
Showing Comments
talmand
This is nice but I would suggest a slightly different markup:
Then change stuff like p.s to span.s in your CSS. This is possibly a little better in terms of accessibility; especially if you put some text in there that you hide with placement hacks.
SdorinDesign
Man i really admire your work i really do,You’re awesome thanks for sharing !