Seeking Examples for Creating Multiple Responsive Headers


New Member
Have watched Eric's tutorial on creating page-specific headers.
I used his technique of using conditional labes and hook boxes with CSS that worked like a champ.
However, as screen size shrinks, the left and right sides of header get cropped.
What I want to happen is for each page's header to shrink but retain the aspect ratio of the full-sized header.

Eric posted another video showing a CSS trick that makes a header logo responsive WITHOUT the need for multiple logo images at different sizes.

Can anyone point me to an example, tutorial or CSS showing how I'd implement a similar trick to create responsive headers on a per-page basis?

Thanks in advance for any suggestions and help.