HTML Syntax .... NOTE: letters X and Y must be capitalized ....
Original -- <img src="image/CSS-Image-Sampler-250120.jpg" style="width:200px; height:320px;">
Horizontal Flip -- <img src="image/CSS-Image-Sampler-250120.jpg" style="width:200px; height:320px; transform:scaleX(-1);">
Vertical Flip -- <img src="image/CSS-Image-Sampler-250120.jpg" style="width:200px; height:320px; transform:scaleY(-1);">
Combined H and V Flip -- <img src="image/CSS-Image-Sampler-250120.jpg" style="width:200px; height:320px; transform:scale(-1, -1);">
The Sampler Image ..... Left-To-Right -- Orginal .... Horizontal .... Vertical .... Combined H and V
2. Alternative method using "transform" "rotateX" and "rotateY"
This coding will produce the exact same display results as presented in example # 1 above. Note
HTML Syntax .... NOTE: letters X and Y must be capitalized. Also, their horizontal-vertical order is reversed from example # 1
Original -- <img src="image/CSS-Image-Sampler-250120.jpg" style="width:200px; height:320px;">
Horizontal Flip -- <img src="image/CSS-Image-Sampler-250120.jpg" style="width:200px; height:320px; transform:rotateY(180deg);">
Vertical Flip -- <img src="image/CSS-Image-Sampler-250120.jpg" style="width:200px; height:320px; transform:rotateX(180deg);">
Combined H and V Flip --
<img src="image/CSS-Image-Sampler-250120.jpg" style="width:200px; height:320px; transform: rotateX(180deg) rotateY(180deg)">