Task 2/5 background-img scaling in .jumbotron

[jsch87]

<Below this line, add a link to the EXACT exercise that you are stuck at.>
Link to the exercise:
https://www.codecademy.com/courses/web-ext/projects/html-css-prj_bestbite

<Below this line, in what way does your code behave incorrectly? Include ALL error messages.>
What do I have to write to make the background-image shrink to the size of the .jumbotron-div?

css:

.jumbotron {
  background: url('https://s3.amazonaws.com/codecademy-content/projects/bestbite/bg.jpg');
  height: 500px;
}

html:

    <div class="jumbotron">
      <div class="container">
        <div class="row">
          <div class="col-md-4 col-md-offset-4">
            <h2>Browse.</h2>
            <h2>Create.</h2>
            <h2>Share.</h2>
          </div>
        </div>
      </div>
    </div>

Thank you for your help!

[muratkh]

background-size:cover;

then use
background-position:center center; to make sure it centers the picture.

** this uses the proper background size to enlarge or shrink the image to fit the jumbotron
it doesn’t distort your image like traditional method of shrinking

[jsch87]

works perfectly, thx!

[muratkh]

i’m glad it did good luck