width von input type text?

[Maik20]

Hi,

ich versuche gerade die Länge des "input type=text"-Feldes per CSS zu modifizieren zu vergrößern. Ich habe folgendes in die css-Datei eingetragen:

.form .input.text{
	width:122px;
}

und folgenden (PHP) HTML Code:

echo "<form action=\"\" method=\"post\"> <h4>Login</h4> 
<label class=\"label\">Benutzername</label> 
<input type=\"text\" name=\"user\">";

Leider klappt es nicht, das Feld ist super klein, würde schätzen 1cm x 5mm oder so.

 

[Maik]

Hi,

das kann so auch nicht funktionieren, denn dein gezeigter CSS-Selektor ".form .input.text" setzt im HTML-Code drei CSS-Klassen voraus, von denen ich dort aber keine einzige wiederfinde.

Das Markup müsste sich demnach so darstellen, damit es zu dem Selektor eine Übereinstimmung gibt, und vom Browser die Regel darauf angewendet werden kann:

<form class="form"><input type="text" class="input text"></form>

Ansonsten verwendest du entweder zu deinem gezeigten HTML-Code den Attribut-Selektor, und entfernst darin die ganzen Punkte:

form input[type=text]{
	width:122px;
}

Oder du rufst im input-Element die Klasse .text auf:

<input type="text" class="text" name="user">

und entfernst im Selektor für Nachfahren die Punkte vor den beiden Elementtypen:

form input.text{
    width:122px;
}

mfg Maik