YUI Button misalignment

Question

Im using YUI and am having alignment problems with YUI buttons inline with text input fields. The rendering problem is occuring in FF3 and is even present on YUI's own site.

http://developer.yahoo.com/yui/examples/button/btn_example09.html

As you can see the button sits higher than the text fields. Any ideas on how to get it all at the same height?

Answer 1

On that page, in FF3, getting rid of the vertical-align:baseline rule got the button to bottom-align with the text input boxes.

So:

#calendarpicker {
    // vertical-align:baseline;
}

Answer 2

Looks like it's also a combination with

.yui-skin-sam .yui-button button, .yui-skin-sam .yui-button a {
    min-height:2em;
}

Commenting that out helps too.

Answer 3

In the end i had to use position:relative;

Here is a YUI example that does actually align correctly: http://developer.yahoo.com/yui/examples/calendar/calcontainer_clean.html

I copied its css