Aller au contenu

« Modèle:Clr/Documentation » : différence entre les versions

De Wikiquestia
Aucun résumé des modifications
Aucun résumé des modifications
 
(7 versions intermédiaires par le même utilisateur non affichées)
Ligne 1 : Ligne 1 :
<div class="documentation" style="background-color: #e6f4ea;">
<noinclude><div class="documentation" style="background-color: #ECFBF3;">{{Sous-page de documentation}}</noinclude>


{{Sous-page de documentation}}
== 📘 Description ==
<p>Lien vers la [[Modèle:{{PAGENAME}}/Documentation|documentation du modèle]].</p>
Ce modèle insère un élément <code><nowiki><div></nowiki></code> permettant de réinitialiser le flottement (clear) dans la mise en page CSS. 
<noinclude>
Il accepte un paramètre pour définir le côté où l’on souhaite stopper le flottement.
== Description ==
'''{{clr}}''' est un modèle servant à forcer un retour à la ligne après des éléments flottants, tels que des images ou des infobox, afin que le contenu suivant ne vienne pas s'afficher à côté.


Il équivaut au code HTML suivant :
Cela évite que les éléments suivants se placent à côté d’éléments flottants (à gauche ou droite) et permet un meilleur contrôle du flux du document.
<pre><div style="clear: both;"></div></pre>


== Utilisation ==
== 🔧 Syntaxe ==
Placez simplement <code><nowiki>{{clr}}</nowiki></code> à l'endroit où vous souhaitez que le contenu suivant commence '''sous''' tous les éléments flottants.
<syntaxhighlight lang="wikitext">{{Clear}}</syntaxhighlight>


=== Exemple ===
=== 🔍 Fonctionnalités ===
<pre>
* Traduit un paramètre simple en la propriété CSS `clear` correspondante.
[[File:Exemple.jpg|thumb|right|Un exemple]]
* Permet de gérer précisément le comportement des éléments flottants dans une page.
Texte qui risque de remonter à côté de l'image...
* Utile pour corriger les problèmes d’empilement d’éléments flottants.


{{clr}}
== 💡 Conseils ==
* Utilisez ce modèle pour forcer le retour à la ligne après des blocs flottants.
* Combinez avec des modèles d’alignement pour une mise en page flexible.
* Ne pas abuser du clear pour éviter de casser la fluidité responsive.


Texte qui commence bien en dessous de l'image.
== 🔗 Voir aussi ==
</pre>
* [[Modèle:Lang]]
 
* [[Modèle:Trim]]
Ce qui donne :
 
[[File:Exemple.jpg|thumb|right|Un exemple]]
Texte qui risque de remonter à côté de l'image...
 
{{clr}}
 
Texte qui commence bien en dessous de l'image.
 
== Voir aussi ==
* [[Aide:Éléments flottants]]
* [[Modèle:Clrright]] — (optionnel) Forcer un retour après un élément flottant à droite uniquement
* [[Modèle:Clrleft]] — (optionnel) Pour les éléments flottants à gauche
 
== Remarques ==
Ce modèle est particulièrement utile dans les pages contenant plusieurs blocs alignés, comme :
* des infobox empilées
* des galeries d'images flottantes
* des encadrés latéraux
 
== Code source ==
<pre>
<div style="clear: both;"></div>
</pre>
----
La documentation de ce modèle est incluse depuis sa sous-page de documentation. Pour plus d’informations, voir la [[Modèle:{{PAGENAME}}/Documentation|documentation du modèle]].
 
== Voir aussi ==
* [[Modèle:Infobox V3/Début]]
* [[Modèle:Infobox V3/Fin]]
* [[Modèle:Infobox V3/Tableau Ligne mixte]]
 
[[Catégorie:Modèle d’infobox]]
[[Catégorie:Infobox V3]]
[[Catégorie:Modèle avec image]]

Dernière version du 27 mai 2025 à 19:39

Note : Ceci est une page de documentation pour un modèle.

📘 Description[modifier le wikicode]

Ce modèle insère un élément <div> permettant de réinitialiser le flottement (clear) dans la mise en page CSS. Il accepte un paramètre pour définir le côté où l’on souhaite stopper le flottement.

Cela évite que les éléments suivants se placent à côté d’éléments flottants (à gauche ou droite) et permet un meilleur contrôle du flux du document.

🔧 Syntaxe[modifier le wikicode]

{{Clear}}

🔍 Fonctionnalités[modifier le wikicode]

  • Traduit un paramètre simple en la propriété CSS `clear` correspondante.
  • Permet de gérer précisément le comportement des éléments flottants dans une page.
  • Utile pour corriger les problèmes d’empilement d’éléments flottants.

💡 Conseils[modifier le wikicode]

  • Utilisez ce modèle pour forcer le retour à la ligne après des blocs flottants.
  • Combinez avec des modèles d’alignement pour une mise en page flexible.
  • Ne pas abuser du clear pour éviter de casser la fluidité responsive.

🔗 Voir aussi[modifier le wikicode]