What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.
We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.
Custom styled scale rating inputs are not working in IE and FFAsked by fivestardestin on September 14, 2016 at 12:17 PM
Question about custom scale rating styling
On one of our survey forms, we're having issues with our scale rating styles not appearing in certain browsers, specifically Firefox and IE. In Chrome (mobile and desktop) and Safari (desktop and iOS) they appear as intended (showing the stars as radio buttons). But in FF and IE, the buttons go missing.
They styling is visible on other radio buttons in FF as well, adding to the mystery. This seems to only be affecting the radio buttons in the scale rating itself.
I've provided a link. Open in both Chrome and Firefox or IE to see what I'm talking about. This first scale ratings show up on page 2 (after clicking 'next' on the first page). You can also see another radio field that displays properly.
Can you think of any reason other buttons show the styling while the scale does not?
scale rating radio buttons custom styling
Thank you for contacting us.
This is most probably not working in IE and FF since we do not have labels for radio inputs inside the Scale Rating field. Unfortunately, I doubt that we can help with this one.
Thanks anyway. It's understandable because we kinda went outside the box with CSS to make the radio buttons in the scale rating appear as stars. Not sure how many other JotForm users have 'customized' their scale ratings like we have, so I just wondered if you'd heard similar problems doing this in those specific browsers.
I coded in a CSS 'hack' for Firefox that makes the default radio buttons appear (instead of just going missing) so that the survey taker can at least choose an answer, while it still appears as intended in Chrome and Safari. Seems to be working that way.
I have never seen customized Scale Rating fields used by other users.
It is common to use a Star Rating tool instead, so you might consider it too.
Please feel free to contact us if you need any further assistance.