Topic: image not showing from local floder for my background
powerwebdesignz
pro
asked 5 years ago
Ollie Vincent
pro
answered 5 years ago
Either way, if you don't put text within the <div class="bg"></div> then the background image will not show (I checked this in version 4.5).
You will then need to put a fixed height (commented as full height) on the image such as:
height: 50vh;
I also think you have a syntax issue in your css... should it not be
background: url("/PWDMDB/img/poweronbg.jpg")no-repeat center center fixed;
Marta Wierzbicka
staff
answered 5 years ago
Try the code from out documentation - https://mdbootstrap.com/css/bootstrap-background-image/.
CSS:
body, html {
height: 100%;
}
.bg {
/* The image used */
background-image: url("https://mdbootstrap.com/img/Photos/Horizontal/Nature/full page/img(20).jpg");
/* Full height */
height: 100%;
/* Center and scale the image nicely */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
HTML:
<div class="bg"></div>
Marta Wierzbicka
staff
answered 5 years ago
.full-height
in your HTML tag, like here <html lang="en" class="full-height">
?
Best,
Marta
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: No
- Technology: General Bootstrap questions
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No