3.0 beta 2

button text alignment in FireFox 3.6


The text and images on a AW.UI.Button are slightly off center when viewed with the latest FireFox release 3.6.

You can see this by going to your Products page on the Active Widgets site: /grid/ (button example).

It does not happen using FireFox 3.5.8.

This is probably a FireFox 3.6 problem, but is there anything we could do to fix this problem?

Setting the button position to absolute seems to fix it, but is there a better solution?


Jim K.
March 16,
We have the same problem..

March 18,
This is a Firefox 3.6 problem (FF3.5.x and earlier are ok). It affects button, label, checkbox and link controls. Can be fixed with -

.aw-ff3 .aw-system-control.aw-text-expand {
    display: inline-block;

Alex (ActiveWidgets)
March 23,
Thanks Alex.
This fixes the FireFox 3.6 problem.
Jim K.
March 25,
Alex, thanks for the fix, but it seems to causes problems with a tab control that is within a table. For example, go to your "divs.htm" example in "controls - tabs", add in the FF3.6 CSS inline-block fix, and also put table elements around the tab span/divs, i.e.:

<span id="myTabs"></span>
<div id="myContent" style="border: 1px solid #aaa; height: 200px; padding: 10px">
<div id="div1" style="display:none">Page 1, empty.</div>
<div id="div2" style="display:none">Page 2, still not much text here...</div>
<div id="div3" style="display:none">Page 3, the last one.</div>

Then you'll see that the tab contrll seems to push a long way to the right. I think the problem is with the span rather than the divs. It only happens with the table elements present (which is how I use the tab control). Any suggestions?
Thanks, Justin
March 30,
Does anyone have any suggestions? Thanks.
April 6,
Are you sure you copied the code correctly (i.e. there is no space between .aw-system-control and .aw-text-expand)?

in any case you can apply the fix to buttons only -

.aw-ff3 .aw-ui-button {
    display: inline-block;
Alex (ActiveWidgets)
April 8,
Thanks Alex. Much appreciated.
April 8,
with ff 3.6.10 and applying the above in style as follows:

.aw-ff3 .aw-ui-button {
display: inline-block;
.aw-grid-control {height: 225px; width: 110%; font: menu;}

still results in non-centered text in the button. do I have this in the wrong place?

Thank you.
October 3,

This topic is archived.

See also:

Back to support forum


Version 2

Looking for AW 2.6 ?
The old site is here.