Blog looks terrible on iPad, iPhone, iPod or mobile- not working right?

  • Author
    Posts
  • #1075465

    Hello. I have the custom CSS and have used it for a few things on our blog. But I cant seem to get our mobile stuff to function right, for instance- on iPad our header gets completely cut off? (I had to use custom CSS to get header that big in the first place, could this have effected it?) Just trying to get the mobile stuff working right… would appreciate ANY ADVICE (posted here since I wasnt sure if I would need to add more CSS?) Thanks in advance for any help in this regard!

    The blog I need help with is joshuatreetables.com.

    #1075834

    The following rules which you added to your Appearance → Custom Design → CSS editor are causing the header image to get cut off on screen sizes with max width of 950 and 980 pixels (that includes iPads):

    @media (max-width: 950px) {
    	#branding,.header-link {
    		min-height: 80px;
    	}
    }
    
    @media (max-width: 980px) {
    	#branding,.header-link {
    		min-height: 60px;
    	}
    }

    Remove those lines from your custom CSS and the larger custom header image should go back to being large on an iPad. Or, if you want to adjust the header differently for an iPad, then keep the @media rules but change the CSS inside them to make the header image look how you want. Note that you can make your computer browser window smaller than 980 or 950px to test.

The topic ‘Blog looks terrible on iPad, iPhone, iPod or mobile- not working right?’ is closed to new replies.