I have been trying to set a header image for my WordPress blog but I can't get it to work properly for small screens as the image gets smaller.
Also, the image goes down when you click the menu on the mobile version.
<header id="masthead" class="site-header" style="background-image: url(<?php header_image(); ?>);background-repeat:no-repeat; background-size:contain; background-position:center;">
.site-branding {
padding: 85px 0;
}
header.site-header{
margin-bottom: 40px;
}
Here's the blog for reference: http://semdesculpas.org/
You can set the background for site-branding
.
<div class="site-branding row text-center" style="background-image: url(http://semdesculpas.org/wp-content/uploads/2018/01/cropped-cropped-Untitled-1-1-1-2.png);background-repeat:no-repeat;
background-size:contain;
background-position:center; margin-top: 20px">
Result:
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.