Square Search Boxes in WebKit
INPUT type of search is a nice semantic addition given to us under the HTML5 label. Unfortunately this element isn't ultra-stylable within WebKit. Here's a quick trick I've found to make
input[type=search] elements look like their basic text counterparts:
-webkit-appearance: textfield allows developers to use
input[type=search] elements that appear as a standard square
INPUT. This is especially useful when looking to add a border to your
With CSS border-radius, I showed you how CSS can bridge the gap between design and development by adding rounded corners to elements. CSS gradients are another step in that direction. Now that CSS gradients are supported in Internet Explorer 8+, Firefox, Safari, and Chrome,...
More often than not, I find myself wanting to upload more than one file at a time. Having to use multiple "file" INPUT elements is annoying, slow, and inefficient. And if I hate them, I can't imagine how annoyed my users would be. Luckily Safari, Chrome,...
Last week I showed you how you could style selected text with CSS. I've searched for more interesting CSS style properties and found another:
INPUT placeholder styling. Let me show you how to style placeholder text within
INPUTelements with some unique CSS code.