Unieś stan CSS Hover po „odblokowaniu”

Stoję przed małym problemem, z którym nigdy wcześniej nie miałem do czynienia. Jestem początkującym projektantem stron internetowych i ostatnio użyłem funkcji CSS hover w div na mojej stronie internetowej. Inny obraz zostaje ujawniony, gdy unosi się nad tym div; jednak nowy obraz znika po „odsunięciu” i chciałbym, aby pozostał widoczny.

Oto przykład kodu, którego używam:

#about {
height: 25px;
width: 84px;
background-image: url('about.png');
position: absolute;
top: 200px;
left: 0px;
}

#onabout {
height: 200px;
width: 940px;
position: absolute;
top: 60px;
left: 0px;
color: #fff;
font-family: 'Lato', sans-serif;
font-size: 15px;
font-weight: 300;
display: none;
}

#about:hover #onabout {
display: block;
}

Czy jest jakiś sposób na rozwiązanie tego problemu za pomocą CSS? Do tej pory nie korzystałem z żadnego javascripta i nie czuję się z tym dobrze.

Tak czy inaczej, wszelkie rozwiązania będą chętnie akceptowane! Dzięki wielkie.

questionAnswers(9)

yourAnswerToTheQuestion