Warum dreht css Hintergrundgröße Bild?

Question

Ich habe gerade etwas CSS (unten) versucht. Aber es dreht das Bild. Ich bin etwas verwirrt und habe das nie gesehen. Bewegen Sie den Mauszeiger in den Ordner, in dem das Bild steht. Wie hörst du damit auf? Muss ich die Position absolute statt Cover verwenden?

NB: Mit Bootstrap 4.

Bild auf der linken Seite ist das Bild mit den Abmessungen 3024x4032 und in dem Ordner ist vertikal stehend nicht horizontal wie das, was in dem Bild unten angezeigt wird.

.room-thumb { 
 
    min-height: 500px; 
 
    width: 100%; 
 
    display: table; 
 
    background-size: cover; 
 
    background-position: center center; 
 
    margin: 20px 0; 
 
} 
 

 
*, 
 
*::before, 
 
*::after { 
 
    -webkit-box-sizing: border-box; 
 
    box-sizing: border-box; 
 
}

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" rel="stylesheet"/> 
 
<section class="rooms"> 
 
    <div class="container"> 
 
    <div class="row"> 
 
     <div class="col-md-12"> 
 
     <div class="row"> 
 
      <div class="col-12 col-sm-6 col-md-4"> 
 
      <div class="room-thumb" style="background-image: url('http://via.placeholder.com/3024x4032');"> 
 
       <div class="inner"> 
 
       </div> 
 
      </div> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</section>

Answer 1

Manchmal ist das Bild pleite. Versuchen Sie, mit Photoshop zu bearbeiten und drehen Sie es um 360 Grad. Dann versuche es noch einmal.