Keeping the header image proportional AND 100% width
-
Hello,
I have struggled with this on my own for awhile, and the answer has alluded me. Perhaps it relates to the theme I have chosen (Nisarg 1.2.8.1). How can I keep my banner image at 100% width the browser window (which it successfully does), while ALSO keeping it at 100% height of the image. In other words, how can I keep the image at full width while retaining the original proportions of the image. Right now, if you change the size of the browser, the header height changes to automatically set heights for different @media settings.
Among others, I have the following adjustments to the Nisarg theme in a child stylesheet:
.site-header {
background-size: 100% 100% !important;
margin-bottom: 2em;
}If I change this to 100% auto, then the image does scale proportionally, but the bottom is cut off.
Thanks,
PaulThe page I need help with: [log in to see the link]
- The topic ‘Keeping the header image proportional AND 100% width’ is closed to new replies.