20. Februar 2010

CSS Formular (form) Ecken abrunden

20. Februar 2010 - Geschrieben von Martin - Keine Kommentare

Überall im Internet tauchen nun Websites auf die ihre Ecken mittels CSS 3 abrunden. Doch viele davon verzweifeln an Formularen, wie

<input type='text' />
<input type='submit' />

Ich habe schon einige entdeckt, die eine extra class für solche Elemente erstellt haben, nur hat das den Nachteil, das man allen Eingabe Elementen auf der Webseite ein class=’input‘ mitgeben muss, deshalb hier nun der elegante Weg:

input[type=text], input[type=password], input[type=submit], textarea
{
  -moz-border-radius: 5px;
}

die 5px geben an, wie weit von der Ecke aus nach innen ein Bogen gemacht werden soll, je größer die Zahl, desto runder die Ecke.