CSSはヘッダーイメージを表示に合わせて作成できません

Question

私のウェブサイトのヘッダーイメージに問題があります。サイズは1920 x 410ピクセルです。

私は全体のイメージが表示されませんでしたが、どういうわけか、すべての面でその部分が切り取られます。

これは私のCSSです：

#banner { 
    background: url('img/kontakt-header-novi.jpg'); 
    background-position: center; 
    background-size: cover; 
    height: 410px; 
} 

そしてHTML：それを修正する方法

<div id="banner"></div> 

？

Answer 1

カバーがフルサイズでそれを表示することです...常に含ん画像

#banner { 
 
    background: url('http://via.placeholder.com/350x150'); 
 
    background-position: center; 
 
    background-size: contain; 
 
    height: 410px; 
 
    background-repeat: no-repeat; 
 
}

<div id="banner"></div>

Answer 2

のすべては、単にbackground-size: cover;

background-size: contain;から

変更を示す - >https://developer.mozilla.org/fr/docs/Web/CSS/background-size