PUBLIC MARKS with tags bouton & css

De bien beaux boutons pour votre site seulement avec du code CSS3

Until some future version of HTML gives us new native controls to use in a browser, at Google, we’ve been playing and experimenting with controls we call “custom buttons” in our apps (among other custom controls).

display: inline-block définitivement production ready !

"Une méthode compatible sur la plupart des navigateurs pour réaliser des boutons simples, des boutons de validation ou des boutons de réinitialisation de formulaire customisés. Tout cela, uniquement en CSS bien sûr. (...) Le principe va être de passer par la balise HTML button qui permet de faire beaucoup plus que la balise input.

know, it’s been a lot of articles lately about CSS buttons. But I simply felt the need to write about something that has not yet been covered in the latest button-trend: Dynamic CSS Buttons using PNG, transparency and background colors that degrades nicely and supports full scalability. With full scalability I mean it should resize in all directions according to the font size and content.

Creating a consistent interface for your users is a constant struggle for every application designer. Building consistency on the web is especially tough because the visual rendering differences across browsers and operating systems are wildly different and almost arbitrary in what can and cannot be done. No where does this become more apparent than when you’re dealing with form elements and the biggest loser of them all in the battle for a standardized look is the infamous Submit button. As is, the input with the type=”submit” is either too ugly (Firefox), a little buggy (Internet Explorer) or completely inflexible (Safari). The solution for most is to use image inputs and create the damn things ourselves. And it’s unfortunate, because then we’re reduced to the tedious tasks of opening up Photoshop every time we’re in need of a new button. What we need is something better—something more flexible and meant for designers. Lucky for us, the solution already exists and all it needs is a little love. My friends, let me introduce you to my little friend : the "button" element.

This tutorial will teach you how to create pretty looking textual buttons (with alternate pressed state) using CSS.