06.02.2012 -  von andre

CSS3

Resize

Elemente in der Größe ändern - mit CSS3 kann der Benutzer Container und andere Elemente verändern. Wie es geht erfarht Ihr hier!

Mit der Eigenschaft resize gibt man dem Nutzer die Möglichkeit bestimmte Container in der Größe zu verändern.

Grundlagen

resize: both;

Alternativ kann statt both auch vertical oder horizontal angegeben werden oder auch none.resize muss immer zusammen mit overflow: auto; geschrieben werden.

Beispiel

#content .video {
background: #EEEEEE;
resize: both;
min-width: 200px;
max-width: 600px;
min-height: 100px;
max-height: 300px;
}

Resize mit CSS3

Resize mit CSS3

 

Der Nutzer kann die Größe der Fläche selbst bestimmen, allerdings wurden die maximalen Werte und minimalen Werte eingetragen. Größer oder kleiner kann die Fläche nicht werden.

Browser

Opera und IE unterstützen die neue Eigenschaft bisher noch nicht. Im Firefox ist resize ab Version 4 möglich, Safari  und Chrome können es schon länger.

Meinung

In dem Beispiel habe ich resize auf einen div Container angewendet. In der Praxis macht es sicher bei <textarea> mehr Sinn. War das Ändern der Größe bislang so nur über Java möglich, bekommen wir zukünftig die Möglichkeit das über die CSS zu regeln.

Kommentar schreiben

Neuere Einträge: Podcast Folge 8 Ältere Einträge: Podcast Folge 7