Having trouble with the background image not displaying correctly even when set to 100%?
https://i.sstatic.net/eavwX.png
I'm currently using Angular and Bootstrap 4 for this project.
<!--html code-->
<div class="bg">
<div style="text-align:center">
<h1>
Welcome
</h1>
</div>
<router-outlet></router-outlet>
This is the .scss code:
body, html {
height: 100%;
}
.bg {
/* The image used */
background-image: url("~/assets/jonatan-pie-226805-unsplash.jpg");
/* Full height */
height: 100%;
/* Center and scale the image nicely */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}