Clever Geek Handbook

YUI buttons mismatch

I'm using YUI and I'm having alignment issues with YUI buttons embedded in input text boxes. The rendering issue happens 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 is above the text boxes. Any ideas on how to get everything at the same height?

0


source to share


3 answers


In the end I had to use position: relative;

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



I copied its css

0


source


On this page, in FF3, getting rid of the rule vertical-align:baseline

caused the button to align with the text input fields.

So:



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


source


It looks like it is a combination with

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

A note about this also helps.

0


source






More articles:


All Articles