I am facing an issue where the image in my <div=img-header>
is not showing up beneath the writing. I have tried multiple methods but none of them seem to work. Can someone assist me?
I attempted changing the class to id, manually resizing the image, modifying the CSS code, and altering the name:
.img-header {
height: 100vh;
min-height: 500px;
background-image: url('img/header.jpg');
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
<header class="img-header">
<div class="container h-100">
<div class="row h-100 align-items-center">
<div class="col-12 text-center">
<h1 class="font-weight-light">My Site</h1>
<p class="lead">Welcome to My site!</p>
</div>
</div>
</div>
</header>
The image inside the div should be displayed underneath the text "My site - Welcome to my site".