سلام.

scaleX(-1) به شما این امکان رو می‌ده که عنصر رو در محور افقی (محور X) "برعکس" کنید.

معنای scaleX:

وقتی مقدار scaleX برابر با عدد مثبتی مثل 1 باشه، اندازه عنصر همون طور که هست باقی می‌مونه.
اگر عدد مثبتی بزرگ‌تر از 1 بدید (مثل 2)، عرض عنصر بزرگ‌تر می‌شه.
اگر عدد مثبتی کوچیک‌تر از 1 بدید (مثل 0.5)، عرض عنصر کوچیک‌تر می‌شه.

معنای scaleX(-1):

وقتی مقدار scaleX منفی باشه، عنصر نه تنها مقیاسش تغییر می‌کنه، بلکه "جهتش" در محور افقی برعکس می‌شه. انگار که شما یه آینه جلوی عنصر می‌ذارید و تصویرش رو وارونه می‌کنید.

فرض کنید یه تصویر از فلش دارید که به سمت راست اشاره می‌کنه. اگر بهش transform: scaleX(-1); بدید، فلش به سمت چپ می‌چرخه، انگار که از محور Y (عمودی) معکوس شده.

حالا وقتی rotate و scaleX رو با هم ترکیب می‌کنید اول عنصر می‌چرخه (با مقدار rotate). بعد از اون، معکوس شدن در محور X (با مقدار scaleX(-1)) انجام می‌شه.
مثلا در مثال شما ابتدا عنصر 220درجه می‌چرخه بعد در محور افقی (X) برعکس می‌شه.