Как сделать, чтобы на textarea { border: 1px solid white; } при :hover{ border:2px solid white;} не прыгала надпись?

Question

[NataVinokur]

Как сделать, чтобы на { border: 1px solid white; } при :hover{ border:2px solid white;} не прыгал надпись?

Comments

[AStek]

Возможно стоить добавить для ховера уменьшение паддинга на 1px?

[Сергей Горячев]

AStek: а если паддинг 0?)

[AStek]

Точно ноль? У тебя тогда текст начал бы к бордера прилипать. Скорее там должно быть что-то по умолчанию.

Answer 1

[Алексей Сол]

Можете сделать с помощью box-shadow, например, симулируя тенью границу.
https://jsfiddle.net/alex_sol/u5trp5ng/

Answer 2

[Сергей Горячев]

https://jsfiddle.net/zyru82ra/

Answer 3

[Froggyweb]

Использовать вместо бордерв псевдоэлемент

Comments

[Сергей Горячев]

Я тоже люблю псевдоэлементы, но пихать их везде и всюду без головы тоже не стоит.

[Froggyweb]

Сергей Горячев: не очень внимательно прочитал вопрос. Но в таком случае я бы использовал тень. Оутлайн недолюбливаю почему то да и тень веселее.

[Сергей Горячев]

Froggyweb: в данной задаче они равнозначны, использовал аутлайн только потому, что писать короче)