Style problem in IE and Firefox

Hello,

i have a problem with iE(Internet Explorer)... I build the layout completly with Firefox. And now i would display the website in all browsers. Opera and Chrome works!
My Problem in IE is:
The Logo on the right corner will have on top and bottom a margin or something. I test to fix this problem with css and in code but it don´t works:

Here is my css code:

/* head line */
.pd_page_header {
	background: #eee url(images/background_head.png) repeat-x bottom left;
	padding: 0px;
}

And the header:

private void createHeader()
	{
		this.header = new HorizontalLayout();
		this.header.setWidth("100%");
		this.header.setHeight(getHeadHeight());
		this.header.setMargin(false);
		this.header.setSpacing(false);
		this.rootLayout.addComponent(this.header);
		this.header.setStyleName("pd_page_header");
	}

At the end i add the logo:

public void addHeadComponent(Component component, Alignment alignment, int expandRatio)
	{
		if (component == null) {
			component = new Label("");
		}
		component.setSizeUndefined();
		this.header.addComponent(component);
		this.header.setComponentAlignment(component, alignment);
		this.header.setExpandRatio(component, expandRatio);
	}

To display it, i have attach two images! The second show the website in internet explorer and first in firefox!