Uneven padding in Chrome & Firefox

Hi,

URL: http://goo.gl/fj3veY

I’m trying to figure out why the padding is not the same in Chrome and Firefox for the Tutorials and Videos buttons in the Browse by Project section at the top of this page.

Chrome (& Safari) has too much padding on the top. Firefox (& IE) is pretty much correct. If I make Chrome look correct, then Firefox is way off.

How can I make them appear the same?

susannelson, both buttons look to have the same width to me in Firefox, Chrome and Opera, and they both remain equal as I narrow the browser window considerably. I don’t see the problem.

Thank you for looking!

I’m sorry I wasn’t more clear. It’s the text that seems off. In Chrome, the words Videos and Tutorials are too low on the button. In Firefox, they are pretty much where they need to be. Do you see that on your end?

Same here do you mean the margin bottom on the ‘Browse by Project’

Edit - words Videos and Tutorials are the same position in Chrome and Firefox for me - Cache issue?

No, I see no difference in the midlines (the vertical position) of the text within those buttons in Chrome and Firefox.

Perhaps you could post a screenshot of what you see in the two browsers.

Interesting. Thanks to both of you for your replies.

I have had this happen before where I see a difference and nobody else does. I’m on a Windows 7 machine. What are you two using?

Mac here

PC. WinXPP

This is what I’m seeing in Chrome on my Windows 7 machine.

The image is awaiting approval. Your note says “in Chrome”… what about Firefox? The issue you’ve reported in a difference between FF and Chrome. Does your image show that difference?

No, I didn’t include Firefox in my screenshot above because I mentioned that it’s displaying correctly for me there. Since you said Chrome looked correct for you, I wanted to show you what I’m seeing in Chrome.

So, here’s a screenshot showing what I see in Firefox:

Edit: How does image approval work? Is there something I need to do or just wait?

OK, you showed me yours, so I’ll show you mine:

Are you possibly importing a “custom” font that the browsers are handling differently? Try substituting a common (PC) font such as Arial and see if that makes a difference. I’ll bet it does. :slight_smile:

(We have to “just wait” for image approval. It’s one of those necessities of life on the 'net.)

Yep - it’s a google font. I didn’t think of that!

Thanks so much for all your help. I’m glad it’s looking good on your end!! :slight_smile:

Thanks for the feedback. Glad it turned out to be easy. :slight_smile:

PS: if my images had been approved already, that was impressively fast!

It’s because you’re one of the cool kids! :wink: