Klawischnigg: Textfeld vorbelegt

Beitrag lesen

Hi there,

man kann ein textfield ja vorbelegen, z.B. wenn ich ein textfield "name" habe, dann schreib ich einfach placeholder="name@firma.de".

Hier http://www.elasticsearch.com/case-studies/ gibt es eine Form, wo nicht nur das Textfield vorbelegt ist sondern auch ein Icon links im Textfield ist.

Meine Frage wäre jetzt, wie ich das machen kann mit HTML5, CSS3 oder weiß jemand beispiele wie ich das machen kann?

Also, ich hab mir einfach den Sourcecode angesehen und folgendes gefunden:

  
 <li class="icon name">  
                <label for="Name">Name <span>*</span></label>  
                <input tabindex="1" class="required combined-name" type="text" placeholder="Name" name="Name" />  
            </li>  

und das sagt mir, daß das Icon nicht IM sondern VOR dem Textfeld ist. Das Textfeld selbst hat keinen Rahmen und durch das Einrahmen des <li>-Elements entsteht der Eindruck, daß das Icon Bestandteil des Input-Elements ist. Bleibt zu erwähnen, daß Du da auch selbst hättest draufkommen können...