Reply To: Scaling header image on moble / iPhone

[livemesh]

When I think about it now, the “background” image actually needs to be a foreground image with text floating on it so that header size gets adjusted as you reduce the window size.

You can overcome the current problem by having this custom code in custom css panel to vary the height of the header as the window reduces the size –

@media only screen and (max-width: 767px) { 
    #title-area { padding: 65px 0; }
}
@media only screen and (max-width: 479px) { 
    #title-area { padding: 35px 0; }
#title-area h2 { font-size: 18px; line-height: 28px; }
}