Bootstrap image-circle is rotated on iOS

I´ve got a problem with an rotating image. The problem occurs on the iPhone in the Safari browser.

You see the (badly) red circled image. On the iPhone it is rotated 90 degrees for no perceptible reason. The image above is displayed correctly on both browsers with exact the same HTML and CSS.

I´m using bootstrap css framework and this is how the images will be displayed:

<div class="col-lg-12" style="text-align: center; margin: 20px; background-color: rgba(255, 255, 255, 0); padding: 30px; border-radius: 20px;">
<div class="col-md-3">
    <img class="img-circle" src="../admin/uploads/categories/<?php echo $categoryRow["img"]; ?>" width="140px" height="140px">
</div>
<div class="col-md-9">
    <h2><?php echo $categoryRow['name']; ?></h2>
    <p><?php echo $categoryRow['description']; ?></p>
    <p><a class="btn btn-default" href="category.php?id=<?php echo $categoryRow['catID']; ?>" role="button">Mehr <?php echo $categoryRow['name']; ?></a></p>
</div>

On this page categories of different articles will be shown with an image (with the problem) plus a headline and description. This happens in a while() which is done by PHP.

The thing is I want to know why the image is rotated on the iPhone, this should not be. The website works perfect on the Android browsers and on Desktop PCs. Just on iOS and Safari this mysterious thing appears. I really hope you can help me with this problem.

Happy Sunday and thanking you in anticipation :)

Answers


It is not problem of bootstrap image-circle. It is problem of image's exif data. Please see How to prevent auto-rotating images on iOS on HTML with CSS/Javascript


Need Your Help

Okta Session hand-over from desktop application to web application

session cookies authorization okta

We have a desktop application that is used to upload content to a web application, both use Okta for authentication. Before uploading, the desktop application authenticates the user via Okta using an

Huge performance difference between Vector and HashSet

java performance vector hashset

I have a program which fetches records from database (using Hibernate) and fills them in a Vector. There was an issue regarding the performance of the operation and I did a test with the Vector rep...