How to rotate image in CSS/html

Question

on my website I have a gallery with some pics of my girlfriend and me, but there are two pics that are displayed upside down. And I don't know why. All other pics are perfect. Every picture is shot by the same iPhone 7+ but first two pictures are upside down on the website. On my computer they are displayed perfectly.

Here is the Website: www.selinaundleon.com/gallery.html Can someone help me with this problem? Thank you very much.

Answer 1

You can create and attach a class to the images (<img> elements) to rotate, using transform:

.rotate-180 {
    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
}

<img src="https://placehold.it/100x100" width="100"/>
<img class="rotate-180" src="https://placehold.it/100x100" width="100"/>