- TellmemoreAsked on September 20, 2013 at 01:16 PM
Here is an example of what I am asking about, which is: increasing the size of the circle--the actual circle that is the radio button.
- JotForm SupportguilledutraAnswered on September 20, 2013 at 02:48 PM
could you try by replacing this custom css code of your form:
width: 3px !important;
for this other one:
width: 60px !important;
height: 60px !important;
Feel free to modify the "60px" values in order to fits your needs,
Hope it helps
Please let us know if you need further assistance
- TellmemoreAnswered on September 20, 2013 at 04:07 PM
Well, I was already told about this on the "part 1" thread, and it didn't work then and it doesn't work now.
If you look at my image, what I want to know is very simple -- can I increase the size of the circle?
If you look at my image above, you will see that the size of the circle (the actual radio button circle) is much bigger than on the actual form.
If you review my first post, I say that this issue of a tiny radio button circle occurs if/when a user is using a MAC computer w/Firefox.
- JotForm SupportTashaAnswered on September 20, 2013 at 09:06 PM
Please take a look at this clone that I made of your form here. If that is what you would like please inject the css below. Please note that the 16px in the CSS can be increased or decreased as needed.
width: 16px !important;
I hope this helps! Please let us know if this solution is still not working for you.
- TellmemoreAnswered on September 20, 2013 at 09:41 PM
The size of the circles are the same! The only thing that changes is the location; in yours, it's moved slightly to the right.
- TellmemoreAnswered on September 20, 2013 at 09:43 PM
P.S. See the circle in my image...it's larger than on my or your form. That is what I am looking for.
- JotForm SupportEltonCrisAnswered on September 20, 2013 at 10:11 PM
Most known browsers like Chrome and FF doesn't support CSS styles for radio buttons and check box. In order to modify it, we have to use some advanced tricks for that. You can try it with the following codes.
/* Radio */
border:2px solid skyblue;
This is a CSS3 code so this is mostly not supported with older browsers like IE.
By the way, you have to removed the following injected CSS code to your form in order for the above code to work.
width: 3px !important;
- TellmemoreAnswered on September 21, 2013 at 08:02 PM
Thank you for the code! But in Google Chrome, my form has 2 circles. Why?
- JotForm SupportabajanAnswered on September 21, 2013 at 09:30 PM
To my knowledge, unless you're okay with using images, there's no surefire way to have the circle appear bigger in all browsers. If you "google" the term "increase radio button size", you'll see what I mean. However, if we come up with something, we'll be sure to inform you.
- TellmemoreAnswered on September 25, 2013 at 02:16 PM
OK, thanks for the info!