Needing help with hover

1

I am looking for some help on hover.

Code:
https://codepen.io/angelinalblyth/pen/GyBoQN?editors=1100

I have 4 images, 3 I want to hover when you mouse over them and the top image should stay static. How do I go about spliting these images up?

I know the rest of the cost is pretty iffy at the moment but it is just being flung together to pass all the tests and now I am trying to go over it to flesh it out and make it looks good. I am starting from the top down, so the first thing is trying to get the first image to not transform.

Any help would be appreciated.

2

You’ll want to change your CSS slightly to target only those images. Currently, you’re targetting all images on the page

#peanut-image img:hover, #almond-image img:hover, #cashew-image img:hover {
  transform: scale(1.25);
}

This will target the three images and apply the hover state to them

3

Thanks I had tried to do what you suggested but I had the tag round the wrong way so thank you for that help. Now to move onto the next issues :slight_smile: