CSS Enhancing Design with CSS Background Images Background Images

Daniel Peel
Daniel Peel
3,636 Points

background-image

hi can anyone tell me where I'm going wrong, the url is correct for the previous but isn't on this one.

style.css
/* Complete the challenge by writing CSS below */
.wildlife {
  background: url(img/bear.jpg) center / cover;
  background-repeat: no-repeat;
}
index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Lake Tahoe</title>
    <link rel="stylesheet" href="page.css">
    <link rel="stylesheet" href="style.css">
  </head>
  <body> 
        <div class="primary-content t-border">
            <p class="intro">
                Lake Tahoe is one of the most breathtaking attractions located in California. It's home to a number of ski resorts, summer outdoor recreation, and tourist attractions. Snow and skiing are a significant part of the area's reputation.
            </p>
            <a class="callout" href="#more">Find out more</a>
      <div class="wildlife">
        <h2>Check out all the Wildlife</h2>
        <p>
          As spawning season approaches, the fish acquire a humpback and protuberant jaw. After spawning, they die and their carcasses provide a feast for gatherings of <a href="#mink">mink</a>, <a href="#bears">bears</a>, and <a href="#eagles">bald eagles</a>.
        </p>
      </div><!-- End .wildlife -->
            <a class="callout" href="#wildlife">See the Wildlife</a>
        </div><!-- End .primary-content -->
  </body>
</html>

1 Answer

Hi Daniel!

This passes all five tasks:

/* Complete the challenge by writing CSS below */
.wildlife {
  background-image: url('./img/bear.jpg'); /*** Task 1 ***/
  background-repeat: no-repeat; /*** Task 2 ***/
  background-position: center; /*** Task 3 ***/
  background-size: cover; /*** Task 4 ***/
  box-sizing: border-box; /*** Task 5 ***/
}

I hope that helps.

Stay safe and happy coding!