In acest articol vom discuta despre o facilitate controversata pe care CSS3 urmeaza sa ne-o aduca. Am citit un articol la un moment dat in care autorul spunea ca nu stie daca sa numeasca sau nu aceasta proprietate inutila.
Eu o voi trata oricum, dupa care veti vedea si de ce. Proprietatea resize, caci despre ea vorbim, este facuta sa permita utilizatorului sa redimensioneze un element din pagina, cum ar fi un div sau un textarea. In principiu cred ca se aplica oricarui elemend de tip block.
Sintaxa arata asa:
resize: none|both|horizontal|vertical; /* Mai in detaliu */ resize: none; // Nu permite redimensionare resize: both; // Permite redimensionarea pe ambele axe resize: horizontal; // Permite redimensionarea doar pe orizontala resize: vertical; // Permite redimensionarea doar pe verticala
Dupa cum vedeti, proprietatea este destul de simpla si sintaxa este usor de inteles. Din pacate, in momentul acesta nu este suportata decat de Safari si Google Chrome (adica motorul Webkit).
De asemenea, se pare ca aceasta proprietate este trecuta in specificatia CSS3 ca fiind “incerta” si nu se stie daca va ajunge in versiunea oficiala. Deci, dupa toate acestea, de ce mai discutam despre ea? La ce ar putea fi ea utila vreodata?
Raspunsul depinde foarte mult de perspectiva din care privim lucrurile. Proprietatea resize nu este neaparat utila prin ceea ce permite ea utilizatorului, ci mai degraba prin ceea ce nu permite.
Unele browsere, cum ar fi Google Chrome permit implicit redimensionarea elementului textarea. Acest lucru nu este intotdeauna benefic, mai ales ca in unele situatii ne poate strica design-ul. Putem sa folosim in mod creativ proprietatea resize pentru a impiedica utilizatorul sa mai faca acest lucru:
textarea {
resize: none;
}
Astfel, daca setam explicit faptul ca nu permitem redimensionarea elementului, acesta este blocat (la fel ca in celalalte browsere).
Vezi Demo
In felul acesta, privind din perspectiva potrivita putem folosi o proprietate aparent inutila in avantajul nostru.