I made an element with visibility: hidden, it turn out visibility: visible when its :hover. It works perfectly on desktop view, but on mobile web it will dissappear when the element being clicked. How can I resolve this? Only set to hidden/dissapear when we click outside the element or the close button.
:hover doesn't fire in mobiles, since mobiles are only click. (You got nothing to hover with!)
Luckily, if you use :active selector in combination with :hover you can achieve this as long as the :active is after :hover.
.element:hover, .element:active{
visibility: visible;
}