Is there another way to set background image?

Question

I have a problem adding the background-image: url() tag to my code. It doesn't display. I've tried everything, added strings, made it the first in the block but nothing works. Quite frustrating.

The HTML:

<div id="home" class="offset">
      <div class="landing">
        <div class="home-wrap">
          <div class="home-inner"></div>
        </div>
      </div>

The CSS:

.home-inner {
  background-image: url("imgs\04-full.jpg");
  position: relative;
  background-size: cover;
}

This is the answer you are looking for: https://stackoverflow.com/a/21374697/14481766 — ishiku_Ultra, Nov 20 '20 at 20:42

Mat.C · Answer 1 · 2020-11-20T23:34:21.293

This is happening becouse the div with the background-image attribute has no sizes so it is displayed in the html page but it has width and heght null.

.home-inner {
  background-image: url(https://www.gravatar.com/avatar/062021b6a1aae23a9651e9ab01ec9e36?s=48&d=identicon&r=PG&f=1);
  position: relative;
  background-size: cover;
  width: 500px; /* fixed width */
  height: 500px;  /* fixed height */
}

<div id="home" class="offset">
      <div class="landing">
        <div class="home-wrap">
          <div class="home-inner"></div>
        </div>
      </div>

Try adding some content to it or giving the div some width and height

Is there another way to set background image?

1 Answers1