10. Oversized radio buttons

For some people, size matters. That's why in this example the radio buttons are really huge:height is set to 100px, and width is set to 200px. As always, different browsers will render these over-sized radio buttons quite differently.

While Internet Explorer 5 only scales the "block" around the input box (see the orange background), Netscape 6 renders this as a rectangle with rounded edges. And while Internet Explorer 5 scales the black circle in the checked radio button, Netscape 6 will merrily display a really small dot (lime in this case, since I set color to lime). None of them seems to do anything with font-size:80px, though. And Opera 5 ignores all but the background-color.

Kinda cute, really. However, I'm not sure about the practical value of such a large radio button. If you found a situation where it is useful, mail me please.

Back to the stylesheet example page.

© Matthias Gutfeldt, 2001. Steal the code, not the content.