Brand new, need help. How do i make images move independently when i hover?

At first i had the images lined horizontally like i wanted. Then i tried to make them move independently when i hovered. I got them to stay in alignment but they all moved at once when i hovered. Now i have them moving independently… but they the alignment was thrown out of whack. My brain is fried from a long day… thanks for any help

Removing this css bit works for me:

.col-sm-3 {
    margin-right: 120px;
    width: 50px;
    height: 50px;
    color: #fff
}

It seems that over here you’re messed with the responsive grid by giving them a width, height, and margin. Bootstrap columns are normally scaled in proportion to the parent container size but you overwritten that here.

1 Like

Cheers! I was messing around with that for a bit including changing the values to 0…but didnt remove it all together. Highly appreciate it!