How do I  get text-align:center  when using min-width property on input button in firefox

Rave_Technologies
Rave_Technologies used Ask the Experts™
on
Hello Everyone,
                         I am new to Experts site. I am facing one problem in css.
Requirement: text should be centered on buttons and button will have minimum width.
Status:  Working fine in IE but not not in Firefox.
Please see the below code which I used for button
  Can any one suggest the css code which works in firefox
.button
{
	width: auto !important;
	min-width: 20mm;
	width: 20mm;
	height: 6mm;
	text-align: center;
	text-align: -moz-center;
	overflow: visible;
	padding: 0em 2mm 0em 2mm;
	margin: 0em 0em 0em 0em;
	color: #330066;
	font-weight: bold;
	font-size: 0.8em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	vertical-align: top;
	font-size: 100%;
}

Open in new window

Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®

Commented:
Working for me in firefox.

Can you show us the entire page ?
Give it this way
.button
{
         width: auto !important;
        min-width: 20mm;
        width: 20mm;
        text-align: center;
        text-align: -moz-center;
        overflow: visible;
        padding: 0em 2mm 0em 2mm;
        margin: 0em 0em 0em 0em;
        color: #330066;
        font-weight: bold;
        font-size: 0.8em;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        vertical-align: top;
        font-size: 100%;
}

Commented:
I think you're talking about how it doesn't vertical align to the center.  It looks like your problem is that your height is too small for your font size, if you increase the height to 10mm or more it centers vertically in firefox and IE.
Success in ‘20 With a Profitable Pricing Strategy

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

Author

Commented:
Hello Friends,
                      I dont no how to reply to ur answers. putting all answers in single comment.

1. Working for me in firefox.
     Can you show us the entire page ?
A)  Please check text having Single  chanracter (eg L). with large data working fine in firefox
2.)Give it this way
    minimum height is required.
3)  i am talking about horizontally center alignment

  Please any one suggest

Commented:
I works for me with single caracter :

<button class="button">a</button>  

how are you using it ?

Author

Commented:
hi,
    I am using like this.
  <input type="button" value="L" class="button"/>

     This code (<button class="button">a</button>  ) I never seen. which language is this?

Author

Commented:
Hello Friend,

                 You are right? working properly in Firefox 3.0 but I want to work in Firefox 1.5.
We are building an application in multilingual which need to support in 12 combinations of OS and browsers.
So we need to take care of all browsers

thanks for your patience.
Please provide any alternative if you know

Commented:
button is an html tag equivalent to input type button.

I don't have firefox 1.5 installed, but maybe you can try to use it instead of <input> tag.
Note you can include html in a <button>; this could be a workaround for your problem.

Author

Commented:
Hello Friend,

              I have tried with your code also in FF1.5 and FF2.0. Eventhough it not working.
Just it working in FF 3.0.

Can u tell me any alternative to get the solution. bcz the deadline of CR (For button) is approaching
Commented:
On firefox 1.5, you get the text left aligned ?

Maybe you can try this (workaround)

.button div {
      width:100%;
      text-align: center;
      text-align: -moz-center;
}

<button class="button" type="submit"><div>a</div></button>

Author

Commented:
Hello Friend,

                    The solution is working fine in FF 1.5. But i have to see how I can implemnet in aspx code.
I mean <asp:button> control.

I am happy with this solution.
Thx for it.
Expert of the Year 2014
Top Expert 2014

Commented:
This question has been classified as abandoned and is closed as part of the Cleanup Program. See the recommendation for more details.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial