CODEWITHSUNDEEP
htmlcss
ReverbOD
ReverbOD

Reputation: 21

Img in <div> don't show

Image in my <div=img-header> doesn't show under the writing, it appear only the writing but not the image, I've tried many ways but ther was unsuceesful. Someone can help me?

I've tried change class in id, manually resize img, change the css code, change 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 from div should appear under the writing "My site - Welcome to my site".

Upvotes: 0

Views: 94

Answers (2)

Fabio Di Stasio
Fabio Di Stasio

Reputation: 38

Check if your .css file is correctly linked. Use browser developer tools to inspect the div and verify if the image is reachable.

Upvotes: 0

Nauman
Nauman

Reputation: 218

Try this background-image: url('/img/header.jpg'); instead of background-image: url('img/header.jpg'); Always provide appropriate path.

Upvotes: 1

Related Questions