Jak zakážu vlastnost textarea s možností změny velikosti?

Chci vypnout vlastnost textarea, která umožňuje měnit velikost.

V současné době mohu měnit velikost textarea kliknutím na pravý dolní roh textarea a tažením myši. Jak mohu tuto funkci zakázat?

Řešení

Následující pravidlo CSS zakazuje změnu velikosti prvků textarea:

textarea {
  resize: none;
}

Pro vypnutí pro některé (ale ne všechny) textarea existuje několik možností.

Zakázat konkrétní textarea s atributem name nastaveným na foo (tj. `<textarea name="foo"> ### Super důležité vědět:

Tato vlastnost nic neudělá, pokud není vlastnost overflow jiná než visible, což je výchozí hodnota pro většinu prvků. Takže obecně platí, že chcete-li ji použít, musíte nastavit něco jako overflow: scroll;

Citace: Chris Coyier, http://css-tricks.com/almanac/properties/r/resize/

Komentáře (6)

V CSS ...

textarea {
    resize: none;
}
Komentáře (0)

CSS 3 obsahuje novou vlastnost pro prvky uživatelského rozhraní, která vám to umožní. Jedná se o vlastnost resize property. Do svého souboru stylů byste tedy přidali následující, abyste zakázali změnu velikosti všech prvků textarea:

textarea { resize: none; }

Jedná se o vlastnost CSS 3; pro zjištění kompatibility s prohlížeči použijte tabulku kompatibility.

Osobně bych považoval za velmi nepříjemné mít zakázanou změnu velikosti u prvků textarea. Je to jedna z těch situací, kdy se návrhář snaží "zlomit" klienta uživatele. Pokud váš návrh nedokáže'pojmout větší textarea, možná byste měli přehodnotit, jak váš návrh funguje. Každý uživatel může do svého uživatelského souboru stylů přidat textarea { resize: both !important; } a zrušit tak vaše preference.

Komentáře (1)