kostenloser Webspace werbefrei: lima-city

Text in Textfeld lässt sich nicht ausrichten

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   b****r

   14:36, 21.7.2008

   Hi Leute,
   
   mein CSS wissen und Google ist am Ende. Hat wer ne idee wie ich den Text im Textfeld dazu bringen kann mittig ausgerichtet zu sein?
   
   http://beliar.lima-city.de/textfeld.png
   
   

   .textfield {
   	font-family: Arial, Helvetica, sans-serif;
   	font-size: 10px;
   	vertical-align: bottom;
   	color: #8c8c8c;
   	font-weight: bold;
   	height: 16px;
   	width: 130px;
   	line-height: 100%;
   	margin: 0px;
   	padding: 0px;
   	text-indent: 2px;
   	display: block;
   	border: 1px solid #9e9e9e;
   }

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. t*****b

   14:38, 21.7.2008

   text-align:center;
4. Autor dieses Themas

   b****r

   15:09, 21.7.2008

   
   text-align:center;
   

   
   gut da hätt ich mich genauer ausdrücken sollen
   
   nicht horizontal mittig sondern vertical mittig.
   
   hab das textfeld (auf wunsch) vergrößert (von 16 auf 19 px) und jetzt klebt der text noch weiter oben
   
   
   Beitrag geändert: 21.7.2008 15:10:00 von beliar
   
   
   Beitrag geändert: 21.7.2008 15:14:57 von beliar

5. ryanblack

   

   ryanblack hat kostenlosen Webspace.

   15:15, 21.7.2008

   `line-height: [Gleiche Höhe wie die Textbox];`
   
   Wenn die Textbox `16px` hoch ist:
   
   `line-height: 16px;`
   
   Ryan
6. Autor dieses Themas

   b****r

   15:43, 21.7.2008

   
   `line-height: [Gleiche Höhe wie die Textbox];`
   
   Wenn die Textbox `16px` hoch ist:
   
   `line-height: 16px;`
   
   Ryan
   

   
   line-height war zwar schon auf 100% aber selbst eine angabe in px hat nichts ergeben der text ist immer noch zu hoch
   
   http://beliar.lima-city.de/textfeld2.png

7. m******s

   15:46, 21.7.2008

   Also, da du schon vertical-align gesetzt hast....
   
   Du könntest es höchstens mal mit margin-top und margin-bottom probieren.... Entweder beide auf die Höhe
   Textfeldhöhe - Textfeldpadding - Texthöhe
   setzen oder mal probieren beides auf auto zu setzen... so zentriert man zumindest divs....
8. Autor dieses Themas

   b****r

   15:57, 21.7.2008

   
   Also, da du schon vertical-align gesetzt hast....
   
   Du könntest es höchstens mal mit margin-top und margin-bottom probieren.... Entweder beide auf die Höhe
   Textfeldhöhe - Textfeldpadding - Texthöhe
   setzen oder mal probieren beides auf auto zu setzen... so zentriert man zumindest divs....
   

   
   
   beides leider erfolglos
   
   Nachtrag:
   ich habe den font-size testweise mal auf 19 px erhöht. trotzdem ist er nicht ganz unten weil er eben platz braucht für ein kleines \"g\", das könnte ich verkraften. verkleinere ich die Schrift dann richtet er es eben nach oben aus --> je kleiner die schrift desto weiter oben ist der Text und das TF schaut leer aus :(
   
   Beitrag geändert: 21.7.2008 16:05:04 von beliar

9. ryanblack

   

   ryanblack hat kostenlosen Webspace.

   16:08, 21.7.2008

   Du könntest ja Innenabstände für oben und unten gleichmäßig definieren. (`padding: 2px 0;`) und `height` entfernen.
   
   (Komisch... `line-height` müsste in der Regel funktionieren; dass es in einem Textfeld nicht funktioniert, wundert mich ein bisschen)
   
   Ryan
   
   Beitrag geändert: 21.7.2008 16:10:20 von ryanblack
10. Autor dieses Themas

    b****r

    16:14, 21.7.2008

    
    Du könntest ja Innenabstände für oben und unten gleichmäßig definieren. (`padding: 2px 0;`) und `height` entfernen.
    
    (Komisch... `line-height` müsste in der Regel funktionieren; dass es in einem Textfeld nicht funktioniert, wundert mich ein bisschen)
    
    Ryan
    
    Beitrag geändert: 21.7.2008 16:10:20 von ryanblack
    

    
    nette idee aber ... *GG* anstatt mir den text weiter nach unten zu verscheieben macht der einfach mal das TF größer ROFL
    
    Nachtrag: hab die höhe entfernt vom TF. Die lösung passt beim FF aber weder beim IE6 noch beim IE7 GRML
    
    Beitrag geändert: 21.7.2008 16:22:27 von beliar

11. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?