Wenn ich ein Padding zu einem Textfeld festlegen, funktioniert es in Ordnung auf den ersten Blick. Aber wenn ich Inhalt eintippe, der über die Textarea-Höhe hinausgeht (wenn du anfängst, den Scroller zu sehen), hört der padding-bottom auf zu existieren. Gibt es eine Möglichkeit, das zu beheben? Es scheint ein Standardverhalten zu sein. Sie können ein sehr einfaches Beispiel hier sehen: http://jsfiddle.net/corinne/LKkky/ PS. Der verwendete Browser ist Chrome. PS2. Gerade mit Firefox versucht und tatsächlich bleibt die Polsterung.Padding-Unterseite für Textarea wird nicht berücksichtigt
Antwort
Chrome, Safari und Internet Explorer rendern die textarea paddings anders als Firefox und Opera. Nun, welche von ihnen rendern die Textareas falsch? Das hängt davon ab, was Sie erreichen wollen, weil in Wahrheit keiner von ihnen es falsch macht, sie fügen alle Polsterung hinzu, es kommt nur darauf an, wie sie die Spezifikation interpretierten.
Keine CSS-Eigenschaft wird dieses 'Problem' beheben, also können Sie dieses 'Problem' nur umgehen, indem Sie ein container-Element zum Textarea hinzufügen und stattdessen eine Füllung geben.
Eigentlich existiert es noch; Sie müssen nur nach unten scrollen, um die zusätzlichen 20px der Auffüllung zu sehen, wenn der Textboxinhalt ausgefüllt ist. Kann ich vorschlagen Überlauf: versteckt.
Ja, du hast recht, eigentlich. Überlauf: versteckt versteckt nur die Bildlaufleiste. Und tatsächlich, es ändert das Problem nicht, ich muss immer noch nach unten schauen, um die Auffüllung zu sehen. – Corinne
Ich habe in jfiddle chrome getestet und wenn der Inhalt auf die Füllhöhe und auf die nächste Zeile gefüllt wurde, fiel der Fokus nach unten, Padding auf der Unterseite, aber Abschneiden der Spitze (nicht großartig ohne eine Bildlaufleiste). Ich glaube, Benutzer mdk hat die beste Lösung für Sie. Vielen Dank für das Teilen dieser Frage. –
'overflow-x: hidden' funktioniert für mich und vertikale scrollbar ist noch verfügbar – andreymal
Sie können den Tag font-size: 0;
dem form
Tag zuweisen, da das Problem darin besteht, dass innerhalb eines solchen Tags irgendwo eine neue Zeile vorhanden ist, die Sie vermeiden müssen.
Danach sollten Sie der Komponente mit dem Inhalt die richtige Schriftgröße zuweisen, im einfachsten Fall dem Textbereich.
- 1. BIRT Spaltenbreite wird nicht berücksichtigt
- 2. GWT Animation Endwert wird nicht berücksichtigt
- 3. MySQL "wait_timeout" wird für lange Abfrage nicht berücksichtigt?
- 4. QML TextArea wird nicht scrollen
- 5. PHP $ _POST wird nicht von textarea
- 6. WYMeditor wird Inhalt nicht in textarea Wert
- 7. AjaxToolkit Calendar Extender Programmatische Wertänderung wird nicht berücksichtigt
- 8. Welcher Typ wird ein Makro berücksichtigt?
- 9. Destination Ziel nicht Trichter berücksichtigt
- 10. mySQL-Abfrage, UND nicht berücksichtigt
- 11. Warum wird der Rückgabetyp bei differenzierenden Methoden nicht berücksichtigt?
- 12. Google Kalender-API: TimeZone wird vom Google-Server nicht berücksichtigt?
- 13. Whay Zero wird nicht von% d Bezeichner berücksichtigt
- 14. GetElementsByTagName, bei dem die Groß-/Kleinschreibung nicht berücksichtigt wird?
- 15. forcePasteAsPlainText wird in Chrome nicht mit Strg + V berücksichtigt.
- 16. Ereignis für Textarea ändert
- 17. difflib.SequenceMatcher isjunk Argument nicht berücksichtigt?
- 18. Stil in HTML nicht berücksichtigt
- 19. JQuery: .val() funktioniert nicht für TextArea
- 20. Jquery: selectionStart für nicht textarea Elemente
- 21. jQuery - textarea Wert wird konvertiert
- 22. NSMutableURLRequest Timeout-Intervall für POST-Anfragen nicht berücksichtigt
- 23. textarea Scrollbar funktioniert nicht
- 24. GetTextExtentPoint32 berücksichtigt nicht die aktuelle Schriftart
- 25. write() -Methode nicht TextArea
- 26. Schaltfläche wird nicht deaktiviert, wenn textArea leer ist
- 27. Android SQLite Wo Klausel nicht berücksichtigt
- 28. SoftLayer-Konto berücksichtigt die Objektmaske nicht
- 29. TextArea Nicht arbeiten JavaScript
- 30. Auto Pop Textarea einmal Seite wird geladen
Ja und Sie können es nicht vermeiden. Setzen Sie das Textfeld in ein div und stylen Sie div, entfernen Sie die Ränder aus textarea und et voila. –
Das Padding ist immer noch da, es fällt nur während der Eingabe unter den unteren Rand des scrollbaren Bereichs. Es wäre das gleiche, wenn Sie ein scrollendes div oder sogar den Körper hätten, wenn die Seite Scrollbalken hat. –
Ich benutze Firefox 8.0 und ich kann nicht sehen, wo das Problem ist. Egal wie viel Text ich eintippe, die Auffüllung ist immer da. Vielleicht ist es spezifisch für den Browser, den Sie verwenden. – Shadowxvii