Wie kann ich ein Hintergrundbild scalebale

Question

Ich habe ein Banner div machen:

<div class="background" style="background: url(<%= @banner.image.url(:big) %>) no-repeat"></div> 

und entsprechende CSS:

#banner { 
    width: 100%; 
    height: 275px; 
} 

#banner .background { 
    width: 100%; 
    height: 275px; 
    background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    -webkit-background-size: cover; 
} 

uploader.rb:

version :big do 
    process resize_to_fill: [1920, 280] 
end 

Bei kleineren Geräten, Die background-image ist beschnitten, hier sind die Screenshots. Volle Breite:

Und eine Größe verändert Fenster:

Gibt es eine Möglichkeit das Bild der Größe veränderbar sein zu machen, wenn die Bildschirmbreite schmal wird? Vielen Dank.

Answer 1

versuchen background-size: 100% auto;

Answer 2

Nur background-size: contain für diese leider

#banner .background { 
    background-size: contain; 
}