Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
zwei Input Type:Text Elemente wie eines
#1
Hallo,

bin noch neu hier und da ich per google auf diese frage hin nicht auf dieses Forum weitergeleiten wurde habe ich die Suchfunktion gleich mal übersprungen ist auch nur ne kurze frage.

Frage:

ich habe folgendes Problem

ich erstelle gerade ein Formular und möchte das ganze natürlich etwas schöner gestallten jetzt stoße ich auf mein erstes Problem das da wäre das ich 2 Input Type:Text elemente nicht dazu bewegen kann sich zu berühren der Code ist wie folgt:

Code:
<div class="formular">

           <form method="post" name="kd_form">
               <select id="vo" title="VO">
                   <option value="11111111">Reutlingen</option>
                   <option value="22222222">Tübingen</option>
                   <option value="33333333">Nürtingen</option>
               </select><br>
               <div class="formname">
                   <input id="name" type="text" placeholder="Vorname">
                   <input id="name" type="text" placeholder="Name">
               </div><br>
               <input id="street" type="text" placeholder="Straße"><br>
               <input id="plz" type="text" placeholder="PLZ">
               <input id="town" type="text" placeholder="Stadt"><br>
               <input id="kdn" type="text" placeholder="Kundennummer">
               <input id="kw" type="text" placeholder="Kennwort"><br>
               <input id="nummer" type="text" maxlength="12" placeholder="Rufnummer">
           </form>
       </div>

und das CSS dazu:
Code:
.formname{
}
#name{
   display: inline-block;
   height: 2em;
   width: 15em;
   text-align: center;
   margin: 0;
   border: 1px 0;
}
#name:first-child{
   border-bottom-left-radius: 15px;
   border-top-left-radius: 15px;
   border-right: 0;
}
#name:last-child{
   border-bottom-right-radius: 15px;
   border-top-right-radius: 15px;
   border-left: 0;
}

das ergebnis sieht aus wie folgt:
[Bild: i62754bvdt9c.png]
wie ihr anhand der Schwarten markierung die ich eingefügt habe sehen könnt ist da ein Rand von dem ich nicht herausfinden konnte wo dieser definiert ist somit kann ich ihn natürlich auch nicht entfernen.

Ich hab das mit 1000% sicherheit schonmal gemacht blos habe ich das Website Programmieren und so alles 1 Jahr schleifen lassen und habe nun solche kleinigkeiten die schweren dinge kann ich natürlich noch auch wenn ich se nicht brauche
Zitieren
#2
Wirklich niemand??
Zitieren
#3
Hi ganz einfach...

bei #name:last-child einfach "margin-left: -5px;"

PS. sehe auch, du hast die id "name" 2-mal vergeben. Dieses ist kein guter Stil.

Gruß
Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste