✔ Schönere Input-Felder

[queicherius]

Hi an alle,

ist es möglich die Rahmenfarbe von einem Input-Feld zu ändern, aber nur, wenn der Benutzer dieses gerade ausgewählt hat?

 

[Maik]

Moin,

das geht mit Hilfe der :focus-Pseudoklasse:

input[type=text]:focus { border:1px solid #f00; }

mfg Maik

 

[queicherius]

Danke erstmal für die schnelle Antwort. Wenn man das einfügt ergibt sich aber das Problem, dass das Input-Feld kleiner wird
(s.Screenshot)

EDIT: Ach ja, wie geht das für Textareas?

 

[Maik]

Dann hast du für das Element keinen "Standardrahmen" deklariert.

input[type=text] { border:1px solid #5794BF; }
input[type=text]:focus { border:1px solid #f00; }

mfg Maik

 

[queicherius]

Danke!
Ich hab's jetzt so gelöst:

input[type=text]{
border: 1px solid #dbdfe6;
border-top: 1px solid #abadb3;
}

textarea{
border: 1px solid #dbdfe6;
border-top: 1px solid #abadb3;
}

input[type=text]:focus{
border: 1px solid #FF5D00;
border-top: 1px solid #FF1500;
}

textarea:focus{
border: 1px solid #FF5D00;
border-top: 1px solid #FF1500;
}