Hi, @elektrobusse1
Add the following code to Appearance -> Customize -> Additional CSS:
@media screen and ( max-width: 768px ) {
.has-header-image .custom-header-media img {
object-fit: contain;
}
}
Thanks indeed this works but, it is the same as setting position:relative.
The black bars above and down are visible.
@elektrobusse1
Please update your theme to the latest version.
After that, add this CSS code in the Customizer and remove the code you added previously:
@media screen and (min-width: 48em) {
.admin-bar.inspiro-front-page.has-header-image .custom-header-media, .admin-bar.inspiro-front-page.has-header-video .custom-header-media {
height: auto !important;
}
}
.has-header-image.home.blog .custom-header, .has-header-image.inspiro-front-page .custom-header, .has-header-video.home.blog .custom-header, .has-header-video.inspiro-front-page .custom-header {
height: auto;
}
.custom-header-media {
position: relative;
min-height: 0;
}
.has-header-image .custom-header-media img {
height: auto;
display: block;
min-height: 0;
}
If this still doesn’t work, we recommend you remove the text from your image or place it in the middle of the image. You can find more tips here:
https://www.wpzoom.com/docs/recommendations-themes-full-width-sliders/
Thanks this helped but there are still some issues with black bars.
For me it would be sufficient if i do not have an header background image at all but i still want to have an image as the top content over the whole screen width and beginning under the nav bar. Do you have a tipp on how i can achieve this. (Remove header image – ok, create an image block on startsite page – ok (but this does not fit over whole screen width and begins not under the navbar but on top of page)