custom header not re-sizing on mobile

Support Forums for LiveMesh Themes & Plugins Forums Squash Theme Support custom header not re-sizing on mobile

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #1715
    Ccbreadccbread
    Member

    hi – i’ve got custom header images on a few pages, added via the “custom heading background” input in the “custom header options” field. then i also checked the box “Custom Heading Content spans entire screen width” right below that. it all looks good on laptop, but on mobile the image is not resizing (the revslider on my homepage does resize), so only about 15% of the left side of the image shows up.

    http://www.arcprogram.org/about-us/

    i tried to rectify this via css, but that image doesn’t actually seem to appear inside the “#custom-title-area” div when i inspect via firebug.

    any suggestions on how to get it to scale properly on various mobile sizes?

    thanks

    #1736
    Livemeshlivemesh
    Keymaster

    Did look at your site. You can have something like below at the bottom of your custom.css file to fix the issue. Pls vary these values as per your exact requirements. You can insert this type of CSS for other headers too in these blocks of media queries –

    @media only screen and (max-width : 1024px) {
        #team-info-header { height: 210px; }
    	#team-info-header blockquote { font-size: 28px !important; line-height: 36px !important;}
    
        }
    @media only screen and (max-width: 767px) {
    	#team-info-header { height: 210px; }
    	#team-info-header blockquote { font-size: 18px !important; line-height: 28px !important;}
    
        }
    @media only screen and (max-width: 479px) {
    
    	#team-info-header { height: 150px; padding: 0;}
    	#team-info-header blockquote { font-size: 14px !important; line-height: 20px !important; top: 0; margin: 10px auto;}
    
        }
    
    #1782
    Ccbreadccbread
    Member

    that works great – thanks very much for your prompt and clear support!

Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘custom header not re-sizing on mobile’ is closed to new replies.