H1 tag doesn't show up

Question

I have div inside header. In that div, I have h1 tag with some text. The div has background image applied. H1 tag does not show up on top of that div. I have tried z inxed. Doen not work...Here's code snippet:
<div class="introduction">
<h1>Some text</h1>
</div>
______________________
.introduction {
background: url(../images/bg-5.jpg) no-repeat fixed;
background-size: cover;
height: 500px;
width: 100%;
}
.introduction h1 {
color: white;
}

Answer 1

Removing the class bg-light appears to fix the issue.
<nav class="navbar fixed-top navbar-expand-lg navbar-light justify-content-between">

Answer 2

You're welcome 😊

Answer 3

Please share your code here
https://code.sololearn.com/#html

Answer 4

You have white on white: Change the text color to something other than white.
.introduction h1 {
color: white;
}

Answer 5

Thank you so much. Now I see that h1 was right behind the navbar. Thanks again. It helped me a lot. Fixed it.

Answer 6

Background image is not white. It is black. And i have white h1 on top of that. And when I refresh the page it shows the h1 tag for few seconds, then background image kinda overrides it :/

Answer 7

https://code.sololearn.com/W3iKE4VBRwpJ/#html