Escondendo textarea alça de redimensionamento no Safari

Question

Eu estou usando componentes textarea no meu aplicativo, e eu controlar sua altura de forma dinâmica. Como os tipos de usuários, a altura é aumentada sempre que houver texto suficiente. Esta multa funciona no IE, Firefox e Safari.

No entanto, no Safari, há uma ferramenta "pega" no canto inferior direito que permite ao usuário redimensionar a área de texto, clicando e arrastando. Notei também esta questão com o textarea no stackoverflow Faça uma página de pergunta. Esta ferramenta é confuso e, basicamente, fica no caminho.

Assim, há de qualquer maneira para esconder essa alça de redimensionamento?

(Eu não tenho certeza se "pega" é a palavra certa, mas eu não posso pensar de um termo melhor).

Answer 1

Você pode substituir o comportamento de redimensionamento com CSS:

textarea
{
   resize: none;
}

ou simplesmente

<textarea style="resize: none;">TEXT TEXT TEXT</textarea>

propriedades válidos são: ambos, horizontal, vertical, nenhuma

Answer 2

Use a seguinte regra CSS para desativar esse comportamento para todos os elementos TextArea:

textarea {
    resize: none;
}

Se você quiser desativá-lo para alguns (mas não todos) elementos TextArea, você tem um par de opções (graças a desta página ).

Para desativar um TextArea específico com o conjunto de atributos name para foo (ou seja, <TextArea name="foo"></TextArea>):

textarea[name=foo] {
    resize: none;
}

Ou, usando um ID (ou seja, <TextArea id="foo"></TextArea>):

#foo {
    resize: none;
}

Note que este é apenas relevante para navegadores baseados no WebKit (ou seja, Safari e Chrome), que adicionam a alça de redimensionamento de controles TextArea.

Answer 3

o max-height oportunidade max-width safari também funciona no Firefox 4.0 (b3pre). bom exemplo aqui a propósito: http://www.alanedwardes.com/ posts / safari-and-redimensionável-textboxes /