Header Logo Not Displaying In Firefox Correctly

So, I’ve never had this problem. I’m usually seeing things wrong in IE. Well, I customized this in Chrome and found that the logo, in Firefox, is way to far to the left than I’d like it to be. Check it out here:

http://www.filmletes.com

Here’s the CSS code:

#header .container { text-align: center; height: 250px; z-index: 2 }
img#logo { clear:both; margin: 0px 0px 0px -650px; }

The theme is designed with the logo in the center, but I wanted it to be to the left (check Chrome or IE, that’s exactly how I want it to look).

Any help would be great… Thanks!

Hi, the problem is that on img#logo you give a huge negative left margin to account for the center alignment being given to the image. Set the margin to 0 and bring it back to the middle.

Now, since the <img> is an inline element, text-align:center on a parent can influence where it appears, on “#header .container” you give text-align:center;, so you can remove that line (and then it will inherit the text-align:left from “.container”) and that should patch things up :slight_smile:

@RyanReese

Thanks so much! Worked perfectly… not sure why I didn’t see that.

It’s quite alright lol :). You’re welcome.