Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Componenti radio e checkbox: allineamento verticale della label errato all'interno di form-group #1261

Open
1 task done
lbertonicsc opened this issue Oct 30, 2024 · 3 comments
Assignees

Comments

@lbertonicsc
Copy link
Contributor

Esiste già una discussione sul tema che ti interessa, o su un tema simile?

  • Ho verificato e non esiste

Versione della libreria

2.10.0

Cosa

Buongiorno,

vorrei portare alla vostra attenzione la seguente problematica.

Utilizzando input di tipo radio o checkbox all'interno di un div contrassegnato dalla classe form-group l'allineamento delle label risulta sfasato rispetto al radio/checkbox:

immagine
immagine

Es:

<div class="form-group">
  <div class="form-check">
    <input type="checkbox" id="ilmioid">
    <label for="ilmioid">Voglio aggiornare i dati del mio profilo con queste informazioni.</label>
  </div>
</div>

Da una mia indagine, questo è dovuto alla proprietà seguente:
immagine

Perché

Ritengo rilevante la segnalazione perché è corretto avere un allineamento verticale appropriato delle label di radiobutton e checkbox.

Contesto

No response

Altro

No response

@zetareticoli
Copy link
Member

zetareticoli commented Nov 4, 2024

Ciao @lbertonicsc,

per quanto riguarda questi elementi form, il codice prevede l'uso della classe .form-check, come documentato:

<fieldset>
  <legend>Gruppo di radio</legend>
  <div class="form-check">
    <input name="gruppo1" type="radio" id="radio1" checked>
    <label for="radio1">Radio di esempio 1</label>
  </div>
  <div class="form-check">
    <input name="gruppo1" type="radio" id="radio2">
    <label for="radio2">Radio di esempio 2</label>
  </div>
</fieldset>

Se usi .form-group viene applicato lo stile da te evidenziato che agisce sulle label degli elementi <input type="text">.

@zetareticoli zetareticoli added help wanted and removed bug Issue e PR su problemi di funzionamento della libreria labels Nov 4, 2024
@lbertonicsc
Copy link
Contributor Author

Buongiorno @zetareticoli,

grazie per la risposta.

Come puoi vedere dal codice che ho riportato sopra uso già la classe form-check.

Uso form-group come da documentazione, quindi secondo me è un bug questo.

@zetareticoli
Copy link
Member

zetareticoli commented Nov 8, 2024

In questi esempi di allineamento di più componenti radio o checkbox, non c'è uso della classe .form-group.

Posso concordare con te che non sia chiaro, però allo stato attuale della libreria, quella classe agisce sull'elemento label, modificandolo erroneamente.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Status: 📋 Backlog
Development

No branches or pull requests

3 participants