Así que básicamente tengo un label y un texto como este:

<label class="labelClass"> for="something">
    <input id="inputID" class="inputClass" name="inputName" value="value" type="radio">
    Some text inside the label.
</label>

Tenga en cuenta que esto es solo un example y no se utiliza para ningún otro medio.


Así que puedo y sé cómo llamar a esto label y input, pero siguen luciendo así:

The problem

Ya probé:

  • margin-right
  • padding y padding-right
  • text-align:center

Como en el siguiente ejemplo de css:

.page-to-the-css label.something.option {
    margin-right:20px;
    padding-right:20px;
    text-align:center;
}

Y también para el botón radio:

.page-to-the-css input.something.inputClass {
    margin-right:20px;
    padding-right:20px;
    text-align:center;
}

Espero que alguien pueda ayudarme a resolver este problema.

Nota: tampoco puedo tocar jquery, javascript ni nada más que css, así que mantenlo en css por favor.

ACTUALIZACIÓN: Ninguna de las respuestas actuales funcionó, tampoco la de VilleKoo.

EDITAR: Este es el formulario que le está sucediendo: formulario Este sitio web es { {X0}} por lo que no puedo llegar a html o lamentablemente no puedo proporcionarles a ustedes code. Espero que este problema pueda resolverse de cualquier manera.

-1
King Reload 22 may. 2017 a las 11:16

3 respuestas

La mejor respuesta

Esto debería funcionar para ti.

label {
  display: block;
}

input { 
  display: inline-block; 
  margin-right: 0.5rem;
}
<label id="labelID" for="something">
    <input id="inputID" class="inputClass" name="inputName" value="value" type="radio">
    Some text inside the label.
</label>
<label id="labelID" for="something">
    <input id="inputID" class="inputClass" name="inputName" value="value" type="radio">
    Some text inside the label.
</label>
1
VilleKoo 22 may. 2017 a las 08:20

Mira mi ejemplo, es fácil

.labelClass {
	position: relative;
	display: block;
	text-align: center;
	padding-left: 20px;
}

.labelClass .inputClass {
	position: absolute;
	left: 0;
}
<label class="labelClass" for="something">
    <input id="inputID" class="inputClass" name="inputName" value="value" type="radio">
    Some text inside the label.
</label>
0
grinmax 22 may. 2017 a las 08:48

Muchos elementos HTML tienen una configuración de margen predeterminada. Puede anular esto y establecerlo en 0. En su caso, desea restablecer el margen derecho en el botón de radio:

<input type="radio" name="beds" value="1" style="margin-right: 0" />

Probablemente desee agregarlo a su hoja de estilo para que se aplique a todos los botones de radio:

input[type="radio"] {
  margin-right: 0;
}
-1
Hyrein 22 may. 2017 a las 08:19