Глючит :hover на IOS

Надо при ховере на элемент раскрывать скрытый текст. На тач девайчас соотвественно :hover отрабатывает по клику. Везде все работает без проблем. Но на IOS при клике блок разворачивается и в этом положении зависает, тоесть блок не сворачивается обратно при клике вне элемента ".text" (Сворачивается только если кликнуть на какой-нибудь другой активный элемент, например на ссылку)

Как это можно поправить?

<a href='javascript:;' class='test'>Some text here blah blah blah. Some text here blah blah blah. Some text here blah blah blah. Some text here blah blah blah. Some text here blah blah blah</a>

.test{
position: absolute;
left: 0;
top: 0;
-webkit-line-clamp: 2;
line-clamp: 2;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
padding-right: 15px;
color: #fff;}

.test:hover{
padding: 5px 11px;
background: #fff;
box-shadow: 0px 7px 64px rgba(0, 0, 0, 0.07);
border-radius: 3px;
-webkit-line-clamp: none;
line-clamp: none;
overflow: show;
display: block;
text-overflow: none;
-webkit-box-orient: vertical;
z-index: 2;
color: #333; }

Ответы (0 шт):