[Louie AParticipant]

Hi,

After upgrading (automatically) to the latest version of firefox, the qty total amount appears as up and down areas. It works fine in other browser. Below are two photos showing the problem in firefox and everythng working smoothly in chrome. Any ideas?

http://americaneventrentals.com/?attachment_id=2798

http://americaneventrentals.com/?attachment_id=2797

[SupportMember]

Hi Louie,

Can you check if the zoom level of your Firefox is in 100%.

Thanks!

[Nick TParticipant]

I have the same problem. My zoom level is 100% in firefox

[Louie AParticipant]

Hi,

Just checked. Zoom level is 100%.

[ChristianModerator]

Hey guys,

Please widen the box for a moment while we workout a fix for this. Add the CSS:

.woocommerce .quantity input[type="number"], .woocommerce-page .quantity input[type="number"] {
    width: 4.65em;
}

Hope that helps. 🙂

[Nick TParticipant]

Thanks for the efforts – made no difference on my site

http://dev.picnicproviders.com/cart/

I also tried increasing the widthe and the height but the digit (number) just doesn’t show.

🙁

[Louie AParticipant]

Ok, this worked for me. I found it after googling. Works in firefox and chrome:

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}

input[type=number] {
-moz-appearance:textfield;
}

————————————————————
So it seems to be new default chrome in firefox. Maybe this code or something like it can be added to any normalize section of the CSS?

[ChristianModerator]

That is right Louie. The problem is only in Firefox though. Chrome works fine. The code below would suffice.

input[type=number] {
    -moz-appearance:textfield;
}

Hope that helps. 🙂

[Nick TParticipant]

BRILLIANT

Thanks Louie so much.

Nx

[RadModerator]

You’re welcome Nick!

[Author]

Posts