Cette fonction est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.
La propriété shape-margin permet d'ajouter une marge à shape-outside.
/* Valeurs de longueur */ /* Type <length> */ shape-margin: 10px; shape-margin: 20mm; /* Valeurs de pourcentage */ /* Type <percentage> */ shape-margin: 60%; /* Valeurs globales */ shape-margin: inherit; shape-margin: initial; shape-margin: unset;
| Valeur initiale | 0 |
|---|---|
| Applicabilité | flottants |
| Héritée | non |
| Pourcentages | se rapporte à la largeur du bloc contenant |
| Média | visuel |
| Valeur calculée | comme spécifié, mais avec les longueurs relatives converties en longueurs absolues |
| Type d'animation | une longueur, pourcentage ou calc() ; |
| Ordre canonique | l'ordre unique et non-ambigu défini par la grammaire formelle |
Syntaxe
Valeurs
<length-percentage>- Définit la marge utilisée pour la forme avec la valeur fournie avec une longueur (
<length>) ou un pourcentage (<percentage>). Les valeurs exprimées en pourcentages sont relatives à la largeur du bloc englobant l'élément.
Syntaxe formelle
<length-percentage>où
<length-percentage> = <length> | <percentage>
Exemples
Voir shape-outside
Spécifications
| Spécification | État | Commentaires |
|---|---|---|
| CSS Shapes Module Level 1 La définition de 'shape-margin' dans cette spécification. |
Candidat au statut de recommandation | Définition initiale. |
Compatibilité des navigateurs
Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une pull request sur https://github.com/mdn/browser-compat-data.
| Fonctionnalité | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Support simple | Oui | ? | Non | Non | Non | 7 -webkit- |
| Fonctionnalité | Android webview | Chrome for Android | Edge mobile | Firefox for Android | Opera Android | iOS Safari | Samsung Internet |
|---|---|---|---|---|---|---|---|
| Support simple | Oui | ? | ? | Non | Non | ? | ? |
Voir aussi
Étiquettes et contributeurs liés au document
Étiquettes :
Contributeurs à cette page :
SphinxKnight
Dernière mise à jour par :
SphinxKnight,