Paramètres de mise en page

Width

Peut differer legerement de l interface reelle.

Point clé :
Définit la largeur du bouton.

Impact :
Stabilise la mise en page quand la longueur du texte varie.

Conseil :
Définir d'abord Min Width, puis ajuster Largeur et Max Width.

Paramètres

• Use width
• Largeur + unité
• Use min width / Min Width
• Use max width / Max Width
• Responsif

fit-content ajuste automatiquement la largeur au texte. % est relatif au parent.

Height

Peut differer legerement de l interface reelle.

Point clé :
Définit la hauteur du bouton.

Impact :
Influence la densité visuelle et la facilité de clic/tap.

Conseil :
Utiliser Min Height comme base et éviter une hauteur fixe trop stricte.

Paramètres

• Use height
• Hauteur + unité
• Use min height / Min Height
• Use max height / Max Height
• Responsif

Une hauteur minimale de 44px est recommandée sur mobile (zone tactile).

Margin

Peut differer legerement de l interface reelle.

Point clé :
Gère l'espace externe autour du bouton.

Impact :
Améliore le rythme visuel entre les blocs.

Conseil :
Définir d'abord les règles verticales globales de la page.

Paramètres

• Utiliser les paramètres individuels
• Marge extérieure (global ou par côté)
• Responsif

Padding

Peut differer legerement de l interface reelle.

Point clé :
Gère l'espace interne du bouton.

Impact :
Affecte directement la lisibilité et la zone cliquable.

Conseil :
Sur mobile, augmenter légèrement le padding vertical.

Paramètres

• Utiliser les paramètres individuels
• Marge intérieure (global ou par côté)
• Responsif

Position

Peut differer legerement de l interface reelle.

Point clé :
Contrôle le placement du bouton.

Impact :
Peut casser la mise en page si mal utilisé.

Conseil :
Rester en relative par défaut, utiliser absolute seulement en cas de besoin clair.

Paramètres

• Type de position
• Top / Right / Bottom / Left
• Z-Index
• Transform Translate X / Y
• Responsif

Avec absolute, le bouton se place par rapport au parent positionné.

Ordre des calques

Peut differer legerement de l interface reelle.

Point clé :
Définit l'ordre des couches.

Impact :
Évite que le texte soit masqué par la miniature, la bande ou l'arrière-plan.

Conseil :
Garder Contenu au premier plan, puis organiser les couches décoratives derrière.

Paramètres

• Contenu
• Vignette
• Bandeau
• Arrière-plan

Les valeurs par défaut sont généralement : Background 0, Band 5, Thumbnail 10, Content 20.