Tiny bit of CSS assistance

Hi All,

I’ve got a small arrow icon next to my menu items, looks perfect in Chrome, but aligned too high vertically in IE8 . Anyone got any idea what I need to change to re-align it? I’ve modified the arrow css padding/margin, but no joy.

The menu’s here: http://www.mytrialdomain.com/2013/

The css in question is:

.navigation-wrapper .sf-sub-indicator { float: none; margin-right: 0; margin-left: 7px; width: 8px; height: 8px; display: inline-block; text-indent: -9999px; background: url(http://www.mytrialdomain.com/2013/wp-content/themes/bluediamond/images/d-arrow.png) center no-repeat; }

Any help appreciated!

Cheers,

Dan

Happens in Firefox as well.

Firebugged it, and adding line-height: 10px; to .navigation-wrapper .sf-sub-indicator fixes it.

Not tested in IE.

You beauties!

Thanks for the help guys, it’s looking great now.

Thanks again.

Dan