'How can I calculate a hover state change based on the original state values?

This may not be possible using just CSS alone buuuut let's give her a whirl.

For example: I have an image with certain margins. let's say something like this:

img {
margin-left: 1em;
}

What I want to do, (I'll write it in pseudo code) is something like this:

img:hover {
margin-left: [take original non-hover state margin, then -1 from that to make 0]
}

Hopefully I'm making sense here if it's even possible - I've really tried to simplify that example down.



Solution 1:[1]

img {
margin-left: 1em;
}
img:hover {
margin-right: 1em;// for minus 1
}

you can use margin-right to subract

P.S remember what you learnt in childhood about net force

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Neptotech -vishnu