Не появляется изображение через backround-image

Question

Почему то не появляется фоновое изображение через background-image: url(). По идее, картинка должна быть у тега с классом .waves

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');

body {
  font-family: 'Roboto', sans-serif;
  margin: 0;
}

h1 {
  font-size: 72px;
  font-weight: 700;
  margin: 0;
}

.marker {
  color: #ADADFF;
}

.title {
  width: 471px;
  height: 252px;
  margin-top: 186px;
}

.container {
  display: block;
  width: 1180px;
  margin-left: auto;
  margin-right: auto;
}

.title {
  width: 471px;
  height: 252px;
  margin-top: 186px;
}

.waves {
  display: block;
  position: relative;
  background-image: url(http://prjct-x.ru/scheme/waves.svg) no-repeat cover;
  width: 100%;
}

<main class="container">
  <div class="title">
    <h1><span class="marker">Ваш</span> планировщик задач</h1>
  </div>
  <div class="waves"></div>
</main>

Должно быть так:

Answer 1

Эта ссылка не работает для вставки в сниппете на stackoverflow http://prjct-x.ru/scheme/waves.svg (возможно из-за того, что это http, а не https), вставил другой svg

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html, body {
  height: 100%;
}

body {
  font-family: 'Roboto', sans-serif;
}

.container {
  display: block;
  max-width: 1180px;
  width: 100%;
  margin: 0 auto;
  display: block;
  padding: 0 10px;
}

.intro {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  background: url(https://www.flaticon.com/svg/vstatic/svg/2087/2087298.svg?token=exp=1607085071~hmac=b4cd580fd8d3966a65d5f28dbec7aafc) no-repeat center;
  background-size: cover;
}

.title {
  font-size: 72px;
  font-weight: 700;
}

.marker {
  color: #ADADFF;
}

<div class="intro">
  <div class="container">
    <div>
      <h1 class="title"><span class="marker">Ваш</span> планировщик задач</h1>
    </div>
  </div>
</div>

БЛОГ НА HUSL

Не появляется изображение через backround-image

Ответы (1 шт):