Header Format Issue in IE and Firefox

[Becca]

Hello Bill!

I was doing a little cross-browser compatibility check, and noticed that the header has some formatting issues in Internet Explorer and Firefox. It looks like the image I use for the header is being stretched out way larger than it should be. Do you have any idea what could be causing this, and is there a way to remedy the issue?

I attached a screenshot showing the issue. . .

Thanks,
Becca

Attachments:

1. 

   Screen-shot-2013-10-02-at-11.10.01-PM.jpg
   

[Bill Robbins]

Hello Becca,

Sorry for the trouble there. That can happen with logo images that are larger than 960 pixels wide with Firefox and IE.

For your best results, I would suggest resizing your logo so that it’s 960 pixels wide. It’s possible to force browsers to make shrink it, but smaller images tend to have a smaller file size which will speed up your site. That’s why for your best results, go with making the image smaller.

If you’d like to force the browser to scale it down, you can do that. Here’s how:

1. Go to the Theme Options page and select the Styling tab.
2. Scroll down to the Custom CSS box and paste this:

   
   #logo {
   	max-width: 100%;
   }
   

3. Update your settings.

If you run into any trouble, let me know,
Bill

[Author]

Posts