Did you check if path to your image is correct or it might be that your image type is .jpeg?
Solution 1 :
Problem :
I have a simple code for a simple webpage, but it does not work: for some reason, the background is not displayed. I checked everything in different browsers on different computers. Where do you think there might be a mistake?
.section--map {
padding: 40px 0;
background: #e6e6e6 url("../images/map-bg.jpg") center no-repeat;
-webkit-background-size: cover;
background-size: cover;
}<section class="section section--map">
<div class="container">
<div class="map">
<div class="map__title">
<div><i class="fas fa-map-marker-alt"></i></div>
<a href="https://goo.gl/maps/XmN4jh6RPPij7qy46" target="_blank"><h2>Open Map</h2></a>
</div>
</div>
</div>
</section>Comments
Comment posted by Mihail Minkov
Do you get any console errors? Is the image path correct?
Comment posted by Oleg Gribanov
Yes, I checked everything many times. It seems that no errors are written anywhere, but visually the background is not present on the page.
Comment posted by jsfiddle.net/b8h4Lpo9
worked fine for me
Comment posted by Oleg Gribanov
Thank you Bryan! Indeed, your code runs on a jsfiddle.net website. Maybe there is a problem only in the Chrome browser?!
Comment posted by Oleg Gribanov
@RachelGallen did you read it? “worked fine for me jsfiddle.net/b8h4Lpo9 – Bryan Dellinger 9 hours ago” He listed both a colour and an image in the background attributes, and it works perfect.
Comment posted by Oleg Gribanov
Yes, I checked everything many times. Moreover, the same thing works in the video clip for one good youtuber.