Text in einem DIV begrenzen

schoko

Erfahrenes Mitglied
Hallo,

zurzeit habe ich ein einzeiliges Eingabefeld über welches ich Text in ein Div schreibe.
Das Div hat eine fixe Breite.

Was ist nun mein Problem?
Zurzeit wird das Div automatisch vergrößert sobald man mehr Text eingibt als Platz im Div zur Verfügung steht. Ich möchte aber die Eingabe so begrenzen, dass der Text niemals über das Div hinausgeht.
Eine Zeichenbegrenzung ist leider auch nicht möglich, da ja "WWWW" größer ist als "IIII".

Ich hoffe das Problem konnte man verstehen!

Für Denkanstöße wie ich mein Problem lösen könnte wäre ich dankbar.

Mit freundlichen Grüßen
schoko
 
... Das Div hat eine fixe Breite.
... wird das Div automatisch vergrößert sobald man mehr Text eingibt als Platz im Div zur Verfügung steht...
Doch keine fixe Breite? :confused:
... Ich möchte aber die Eingabe so begrenzen, dass der Text niemals über das Div hinausgeht...
Textüberlauf? Umschließt der DIV-Block den Text nicht? :confused:
... Ich hoffe das Problem konnte man verstehen! ...
Nein, nur dass "WWWWW" wahrscheinlich noch größer als "WWWW" ist.
Freundliche Grüße retour!
 
Wenn das div voll ist, soll dann auch gleichzeitig keine weitere Eingabe in das Textfeld gemacht werden können, bis wieder ein Teil aus dem Textfeld gelöscht wird oder ist das egal?

Wenn es egal ist, wäre die einfachste Konstruktion so etwas:
HTML:
Bitte Text für die Box eingeben:

<input type="text" onkeyup="
    document.getElementById('content').innerHTML = this.value;
" />

<div style="
    position:relative;
    overflow:hidden;
    height:120px;
    width:128px;
    background-color:blue;
">
    <div id="content" style="
        position: absolute;
        width: 117px;
        padding: 5px;
        left: 0;
        top: 0;
    ">
         &nbsp;
    </div>

</div>
Ist es nicht egal müsstest du noch abfragen, ob die neue größe der Box größer ist als der container und die Änderung in dem Fall rückgängig machen. Das wäre aber auch nicht so sonderlich kompliziert und sei den Studenten als Übungsaufgabe überlassen :D
 
Zuletzt bearbeitet:
Zurück