CSS hover event, Animation wont run-CodePudding

I have a container that holds image holder and text holder. I can set it so that on hover the image scales and the same for the text. YET when I try so set the image holder hover to scale the image and a secondary action to scale the text, hover just doesnt do the animation .

<div >
    <div ><img></div>
    <div ><text></div>
</div>

CSS
.imageholder:hover .textholder{
    transform: translatey(100%);
    transform: scale(1.1);
    transition: .5s ease;
}

CodePudding user response：

heii, you can change your code like this :

.imageholder:hover, .textholder:hover{
    transform: translatey(100%);
    transform: scale(1.1);
    transition: .5s ease;
}

<div >
    <div >this is image</div>
    <br/>
    <div >this is a text</div>
</div>

CodePudding user response：

You need to add coma in your css like this:

.imageholder:hover, .textholder:hover{
    transform: translatey(100%);
    transform: scale(1.1);
    transition: .5s ease;
 }