Discussion :

[Paul Van Walleghem]

Bonjour,

J'ai créé un RadioButtonList en code behind. Le texte de chacun de ses ListItem s'étend sur deux lignes.
1) Comment puis-je aligner la ligne du dessous sur la ligne de dessus ?
2) Est-il possible de définir la couleur des boutons radio ?

Merci beaucoup

[popo]

Ceci pourrait t'intéresser.
Et notamment l'appel avec TextFormatFlag.
https://docs.microsoft.com/en-us/dot...tframework-4.8
https://docs.microsoft.com/en-us/dot...tframework-4.8

[Paul Van Walleghem]

Oui, ça m'aide bien pour orienter mes recherches et améliorer le rendu du côté du navigateur client. Cependant, si vous me le permettez, ce sont des classes et des méthodes de
System.Windows.Forms. Auront-elles un impact dans le contexte Web ?

[popo]

Mea culpa.
J'ai répondu en pensant que j'étais dans une partie du forum.

Du coup ces liens ne vous serviront à rien.
Par contre comme toute application Web, vous pouvez changer l'apparence avec du CSS.

[Paul Van Walleghem]

Oui, d'accord pour l'utilisation de CSS. Mais la question est de savoir quelles propriétés CSS influencent la mise en forme des ListItems d'un RadioButtonList ? Comme ceux-ci ne semblent pas être traités comme des paragraphes (ce qui paraît logique), des propriétés comme "margin-left" ou "text-indent" n'ont pas d'effet sur l'apparence des ListItems.

Vu qu'un RadioButtonList est un contrôle ASP.NET, je me demande si des propriétés CSS spécifiques lui sont dédiées et lesquelles.

[popo]

Cela va dépendre du code HTML généré qui lui même va dépendre de votre code C#.
Sans savoir de quoi on part, il va être difficile de vous aider.

Edit :
Ceci semble répondre à votre besoin :
https://social.msdn.microsoft.com/Fo...um=aspwebforms

[Paul Van Walleghem]

En fait, j'écris en vb.net. Ma fonction est la suivante:

Code VB.NET :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
    ''' <summary>
    ''' Obtient une nouvelle RadioButtonList pour valider les réponses
    ''' </summary>
 
    Private Function GetNewRadioButtonListValidRep() As RadioButtonList
        Dim radioList As RadioButtonList = New RadioButtonList
        Dim itemPlusTard As New ListItem
        Dim itemValider As New ListItem
        With itemPlusTard
            .Attributes.CssStyle.Add("margin-left", "1.5em")
            .Attributes.CssStyle.Add("text-indent", "-1.5em")
            .Attributes.CssStyle.Add("line-height", "1.5em")
            .Selected = True
            .Text = "Je n'ai pas répondu à toutes les questions et je reviens les compléter plus tard"
            .Value = "False"
        End With
        With itemValider
            .Attributes.CssStyle.Add("margin-left", "1.5em")
            .Attributes.CssStyle.Add("text-indent", "-1.5em")
            .Attributes.CssStyle.Add("line-height", "1.5em")
            .Selected = False
            .Text = "J'ai terminé de répondre au questionnaire et je supprime mon identifiant"
            .Value = "True"
        End With
        With radioList
            .Items.Add(itemPlusTard)
            .Items.Add(itemValider)
            .TabIndex = 0
            '.CssClass = "Sauvegarde"
            .RepeatLayout = RepeatLayout.Flow
        End With
        Return radioList
    End Function

[popo]

J'ai l'impression que votre problème provient styles que vous appliquez.
Vous décalez le bouton vers la droite et décalez son texte vers la gauche.
Avez-vous essayez d'enlever tout ça pour laisser le moteur gérer lui-même le placement.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.Attributes.CssStyle.Add("margin-left", "1.5em")
            .Attributes.CssStyle.Add("text-indent", "-1.5em")
            .Attributes.CssStyle.Add("line-height", "1.5em")

De plus, le fait que fassiez du VB ne change rien.
Si vous faites réellement de l'Asp.Net, le fait de rajouter une classe sur le RadioButtonList (et bien entendu de décrire cette classe CSS quelque part) devrait faire le job

[Paul Van Walleghem]

Bonjour,
D'abord, un grand merci pour vos réponses.

En fait, si je ne mets pas de CSS, voici l'image du RadioButtonList.


La deuxième ligne de chaque item s'aligne sur le bouton et pas sur le texte. Or, ce n'est peut-être qu'une question subjective de goût, mais je garde l'impression que le RadioButtonList gagnerait en lisibilité si la deuxième ligne était alignée sur le texte de la première, et pas sur le bouton. C'est pourquoi je fait un "text-indent" négatif. Le "margin-left" m'est apparût utile pour que les boutons ne soient pas collés au bord de la fenêtre du navigateur.

Cependant, aucune de ces propriétés influence la mise en forme du contrôle. Tandis que "line-height" joue bien son rôle. Pourquoi ? Auriez-vous une idée ?

[popo]

Vous n'avez pas compris le rôle de text-indent.
La propriété text-indent définit la longueur qui doit être laissée avant le début de la première ligne d'un élément contenant du texte.

Plus de détail ici :
https://developer.mozilla.org/fr/doc...SS/text-indent

En lui fournissant une valeur négative, vous décalez le texte vers la gauche (ce qui est l'inverse de ce que vous souhaitez faire).

Je reste persuadé que le lien que je vous ai fourni est la solution à votre problème.
Mais puisque vous ne fournissez toujours pas le HTML généré, il est compliqué de vous fournir un CSS adapté.

[Paul Van Walleghem]

Excusez-moi, je n'avais pas vu votre lien, je viens de l'ouvrir. Vous avez certainement raison, il va me permettre de résoudre le problème. C'est le même cas de figure en tous cas.
Je vous remercie beaucoup de m'avoir guidé.
Sincères salutations,