הקטנה פרופורציונלית ל2 תמונות בגדלים שונים (CSS)

[חגית קרמר]

יש לי 2 תמונות
לכל אחת גובה ורוחב שונים
אני רוצה להקטין אותן באותו היחס ברספונסיביות.

שתיהן position:absolute בתוך div בגודל זהה (כל אחת בdiv אחר)

באופן תיאורטי הקוד צריך להיות כזה (אבל זה לא קוד תקין)

width: calc(auto - 50px);

רוחב באחוזים הוא יחסי לdiv, כך שזה לא טוב כאן.

 

[גזעי]

אפשר jsfiddle עם דוגמא?

 

[UU]

נראה לי אפשר לשחק עם זה ב-max-width ו-max-height עם נוסחא דומה למה שכתבת

 

[צנצנת]

תתני לשתיהן את ה width הרצוי
ואז object-fit: contain