Search code examples
csscss-transforms

Scale element in X and Y by the same amount of pixels

I'd like to scale an element by the same absolute amount of pixels (not the same ratio) in the X and Y direction such that

newWidth = oldWidth + n
newHeight = oldHeight + n

where n is the number of pixels gained in size and oldWidth and oldHeight are unknown.

Is there a way to do this in pure CSS?

Solution

  • If the dimensions are unknown, you can't use CSS. In this case, only JavaScript can do that.

    To do that in JavaScript, first grab the dimension of the element, and then add or subtract a value dynamically.