Replies: 0
Hello everyone,
I’m trying to customize the Twenty Sixteen theme; my goal is to give a background color to the header-image div and have this background color extend to the horizontal edges of the viewport like a banner.
I’ve created a child theme, twentysixteen-child, with the following files in addition to the standard functions.php:
header.php:
* Added a parent <div class=”header-image-container”> right before <div class=”header-image”> (Line 91), closing </div> right after <!– .header-image –> (Line 95)
style.css:
.header-image-container {
width: 500%;
margin-left: -200%;
background-color: #153874;
}
.header-image {
text-align: center;
margin-top: 0;
margin-bottom: 0;
width: 100%;
}
.site {
overflow: hidden;
}
This worked great! EXCEPT, the header image is no longer responsive – the large image displays regardless of viewport size. Could someone help me fix this?
Site: https://www.mamcoaana.org
Twenty Sixteen version: 1.3
Thanks!
Nick