Hi Alex,
if you remove all width settings form your current css buttons stylesheet, and replace it by this:
Code:
input.cssButton, input.cssButtonHover{
/* width: 0; needed to stop IE adding "magic" padding to the input */
width: 0 !important;
overflow: visible;
}
input.cssButton[class], input.cssButtonHover[class] { /* IE ignores this [class]*/
width: auto !important;
}
(the !important attributes are needed in this case to over ride the current inline styling of the buttons)
The button width will be adjusted (depending on the amount of buttontext) by your browser.
And adding height and line-height settings (often, but not always unfortunately) helps to get the same height for both link and input buttons:
Code:
.cssButton, .cssButtonHover{
line-height: 1.5em;
height: 1.5em;
}
(replacing exisiting height settings, line-height and height need to have the same value, and exsisting padding settings might have to be adjusted as well). You can try other sizes of course, as well as using px sizes (I am not sure if your font-sizes are currently in pixels).
hth
Bookmarks