You need to absolute position the head shot within the cover block container. But in doing so the container shrinks so you need to specify its height to maintain the same look.
.wp-block-cover.alignfull.is-light {
height: 360px;
}Then absolute position the head shot image container. The bottom dimension is simply 0, but to center the image at varying viewport widths a calculation needs to be made:
figure.wp-block-image.size-full.is-resized {
position: absolute;
bottom: 0;
left: calc(100vw/2 - 227px);
}Custom CSS like this is best placed in the Additional CSS section of the customizer or style book.
You’ll need to alter the layout at narrower screen widths by using media queries because the site title ends up behind the head shot. The menu positioning may not be ideal either.
Thanks,
Custom CCS is new for me but it is working.
However still need to figure out how it works exactly!
Somehow othe rpictures have moved spot after I added custom CCS.
appears i didnt only change Custom CCS for header but for everything.
Need to get this right!
- This reply was modified 13 hours, 57 minutes ago by .
Links – Julie Andrews Admirers Forum
look at this page, that is what happened to my website.
Header picture is correct, but alll the other pictures are out of position.
Could use some help please with this marvelous option custom CCS