2

Buenas tardes programadores,

Mi consulta, como dice en el titulo, se puede eliminar el punto central del radio buttom? Me gustaría hacer que quede solo el borde del radio buttom.

#a {
  cursor: pointer;
  position: absolute;
  top: 5%;
  left: 5%;
}
<input id="a" type="radio" name="radio">

2
  • No entiendo lo de el punto central.... ¿puedes explicar mejor?
    – user128299
    Commented el 19 abr. 2021 a las 17:12
  • Un radio buttom visualmente en html es un borde circular y un circulo completo en medio en caso de estar checked, mi intencion es quitar el circulo del centro y dejar solo el borde en caso de estar checked. Nose si se me permita hacer eso o tendre que crear mi propio radio buttom?
    – GBY
    Commented el 19 abr. 2021 a las 17:23

1 respuesta 1

3

A ver si esto te sirve:

input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  border: 2px solid #999;
  transition: 0.2s all linear;
  margin-right: 5px;
  position: relative;
  top: 4px;
}

input:checked {
  border: 3px solid blue;
}
<h2>Selecione una opcion</h2>
<input type="radio" id="opcion" name="uno" value="opcion">
<label for="opcion">Opcion1</label>

Definiendo el valor del border en el input:checked puedes modificar el grosor del botón.

1
  • 1
    En efecto mi estimado, era lo que buscaba, muchisimas gracias
    – GBY
    Commented el 19 abr. 2021 a las 18:18

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.