Tuesday, February 2, 2016

CSS textarea - Feste Größe - Größe fixieren

CSS textarea - Feste Größe - Größe fixieren

Um zu verhindern, dass der Benutzer die Größe einer textarea (mehrzeiliges Textfeld) im Browser verändern kann, wird folgendes CSS verwendet:

CSS:
textarea {
    resize: none;
}

Um nur die Größe einer einzigen textarea zu fixieren, kann folgendes CSS verwendet werden:

HTML:
<textarea id = "my_textarea" rows="5" cols="20"></textarea>

CSS:
#my_textarea {
    resize: none;
}

Anmerkungen:

Wenn die CSS-Eigenschaft resize auf none gesetzt wird, verschwindet der "Anfasser" in der unteren rechten Ecke der textarea. Der Benutzer kann die Größe der textarea nicht mehr verändern.

Die exakte Größe einer textarea kann per CSS angegeben werden. Hierfür verwendet man die altbekannten CSS-Eigenschaften height und width:

CSS:
#my_textarea {
    width: 400px;
    height: 200px;
    resize: none;
}

Die resultierende textarea ist nun exakt 400px breit und 200px hoch, Ihre Größe kann nicht verändert werden.

Zusatz:
Werden die HTML-Attribute rows und cols für eine textarea definiert und ebenfalls die CSS-Eigenschaften height und width für diese textarea angegeben, so haben die CSS-Eigenschaften den Vorrang.

No comments:

Post a Comment