How to change the size of the radio button using CSS?

by

This css seems to do the trick:

input[type=radio] {
    border: 0px;
    width: 100%;
    height: 2em;
}

Setting the border to 0 seems to allow the user to change the size of the button and have the browser render it in that size for eg. the above height: 2em will render the button at twice the line height. This also works for checkboxes (input[type=checkbox]). Some browsers render better than others.

From a windows box it works in IE8+, FF21+, Chrome29+.

More Related Contents:

  1. How do I change the color of radio buttons?
  2. How to make a radio button look like a toggle button
  3. How long can a background-image be?
  4. Expand a div to fill the remaining width
  5. How to make an image center (vertically & horizontally) inside a bigger div [duplicate]
  6. Margin-Top push outer div down
  7. Can I use div as a direct child of UL?
  8. Add centered text to the middle of a horizontal rule [duplicate]
  9. Make wrapper take maximum width of child image? [duplicate]
  10. How can I display just a portion of an image in HTML/CSS?
  11. text-overflow is not working when using display:flex
  12. Center aligning a fixed position div
  13. CSS Float: Floating an image to the left of the text
  14. Why would margin not be contained by parent element?
  15. Why doesn’t “margin: auto” center an element vertically?
  16. CSS Float Logic
  17. Table row won’t contain elements with position:absolute
  18. How to create a Slanted Background with CSS? [duplicate]
  19. Centering floating divs within another div
  20. How to center div vertically inside of absolutely positioned parent div
  21. Vertical Alignment of text in a table cell
  22. How to use an tag inside a in the middle of a text? [duplicate]
  23. CSS to line break before/after a particular `inline-block` item
  24. Table overflowing outside of div
  25. Center an image horizontally using CSS
  26. Alternate background colors for list items
  27. Styling HTML email for Gmail
  28. Change Bootstrap input focus blue glow
  29. Angular4 – Scrolling to anchor
  30. How to implement a Navbar Dropdown Hover in Bootstrap v4?

Leave a Comment