diff options
author | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2021-09-17 20:15:31 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-09-17 20:15:31 +0200 |
commit | 3335211db9ecb67dc0ccd9c4a7c1eb607ffe359f (patch) | |
tree | 09fe8f8a5fae5235b62918e8b7161fd34480b8d0 /files/fr/web/css/place-content/index.html | |
parent | 3518481e9190f19bbf81741704f45cb3c1761758 (diff) | |
download | translated-content-3335211db9ecb67dc0ccd9c4a7c1eb607ffe359f.tar.gz translated-content-3335211db9ecb67dc0ccd9c4a7c1eb607ffe359f.tar.bz2 translated-content-3335211db9ecb67dc0ccd9c4a7c1eb607ffe359f.zip |
Prepare CSS section for Markdown conversion (#2307)
* Removes summary / seoSummary classes
* Remove div class=hidden and some notranslate
* Remove hidden paragraphs for live sample
* Remove hidden paragraphs for live sample - take 2
* Remove other hidden div and p - updated w/ en-US when necessary
* Remove ids
* Remove notranslate class
* Fix typo which broke build
* remove div class='index'
* remove useless <span style=...>
* remove non typographical sups
* remove non typographical subs
* remove blockindicator and fix some div.note
* fix build :/
* remove useless classes
* fix build - again :x
* fix unhandled elements 1/N + embedlivesample build fail
* fix div.warning
* Fix fixable flaws - hoping to reduce error conversion
* Remove unecessary images (same as en-US)
* fix div notes
* fix warnings
* fix some dl handling
* fix dls
* Fix a bunch of conversion errors
* rm unhandled figures
* Fix other set of issues and revamp easing-function page
* Fix some one-offs conversion errors (incl. deki files)
* fix the rest of one-off conversion issues
* Fix last dl standing
Diffstat (limited to 'files/fr/web/css/place-content/index.html')
-rw-r--r-- | files/fr/web/css/place-content/index.html | 22 |
1 files changed, 8 insertions, 14 deletions
diff --git a/files/fr/web/css/place-content/index.html b/files/fr/web/css/place-content/index.html index 4dc5d23259..58064fcb1f 100644 --- a/files/fr/web/css/place-content/index.html +++ b/files/fr/web/css/place-content/index.html @@ -12,9 +12,7 @@ translation_of: Web/CSS/place-content <p>La propriété raccourcie <code><strong>place</strong></code><strong><code>-content</code></strong> permet de définir les valeurs des propriétés {{cssxref("align-content")}} et {{cssxref("justify-content")}}. Elle peut être utilisée pour n'importe quelle méthode de disposition (boîtes flexibles, grilles, etc;) qui prend en charge ces deux propriétés d'alignement.</p> -<div>{{EmbedInteractiveExample("pages/css/place-content.html")}}</div> - -<p class="hidden">Le code source de cet exemple interactif est disponible dans un dépôt GitHub. Si vous souhaitez contribuez à ces exemples, n'hésitez pas à cloner <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> et à envoyer une <em>pull request</em> !</p> +<div>{{EmbedInteractiveExample("pages/css/place-content.html")}}</div <h2 id="Syntaxe">Syntaxe</h2> @@ -46,7 +44,7 @@ place-content: unset;</pre> <p>La première valeur utilisée sera celle qui correspond à {{cssxref("align-content")}} et la seconde valeur correspondra à {{cssxref("justify-content")}}. Si la deuxième valeur n'est pas présente, la première valeur indiquée sera également utilisée pour <code>justify-content</code>.</p> <div class="warning"> -<p><strong>Attention !</strong> Si une seule valeur est fournie et que celle-ci est invalide pour l'une ou l'autre des propriétés détaillées, c'est la déclaration entière qui sera invalide.</p> +<p><strong>Attention :</strong> Si une seule valeur est fournie et que celle-ci est invalide pour l'une ou l'autre des propriétés détaillées, c'est la déclaration entière qui sera invalide.</p> </div> <h3 id="Valeurs">Valeurs</h3> @@ -89,7 +87,7 @@ place-content: unset;</pre> <h3 id="CSS">CSS</h3> -<pre class="brush: css; highlight[7]">#container { +<pre class="brush: css">#container { display: flex; height:240px; width: 240px; @@ -171,10 +169,7 @@ div > div { </select><code>;</code> </pre> -<div class="hidden"> -<h3 id="JavaScript">JavaScript</h3> - -<pre class="brush: js">var update = function () { +<pre class="brush: js hidden">var update = function () { document.getElementById("container").style.placeContent = document.getElementById("alignContentAlignment").value + " " + document.getElementById("justifyContentAlignment").value; } @@ -193,7 +188,6 @@ direction.addEventListener("change", function (evt) { document.getElementById("container").style.direction = evt.target.value; }); </pre> -</div> <h3 id="Résultat">Résultat</h3> @@ -235,10 +229,10 @@ direction.addEventListener("change", function (evt) { <h2 id="Voir_aussi">Voir aussi</h2> <ul> - <li><a href="/fr/docs/Web/CSS/Disposition_des_boîtes_flexibles_CSS/Utilisation_des_flexbox_en_CSS">Utiliser les boîtes flexibles en CSS</a></li> - <li>Guide sur les grilles : <em><a href="/fr/docs/Web/CSS/CSS_Grid_Layout/Alignement_des_boîtes_avec_les_grilles_CSS">Aligner des objets dans une grille</a></em></li> - <li>Guide sur les boîtes flexibles : <em><a href="/fr/docs/Web/CSS/Disposition_flexbox_CSS/Concepts_de_base_flexbox">Les concepts de bases</a></em></li> - <li>Guide sur les boîtes flexibles : <em><a href="/fr/docs/Web/CSS/Disposition_flexbox_CSS/Aligner_des_éléments_dans_un_conteneur_flexible">Aligner des objets dans un conteneur flexible</a></em></li> + <li><a href="/fr/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox">Utiliser les boîtes flexibles en CSS</a></li> + <li>Guide sur les grilles : <em><a href="/fr/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Aligner des objets dans une grille</a></em></li> + <li>Guide sur les boîtes flexibles : <em><a href="/fr/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox">Les concepts de bases</a></em></li> + <li>Guide sur les boîtes flexibles : <em><a href="/fr/docs/Web/CSS/CSS_Flexible_Box_Layout/Aligning_Items_in_a_Flex_Container">Aligner des objets dans un conteneur flexible</a></em></li> <li><a href="/fr/docs/Web/CSS/CSS_Box_Alignment">Le module de spécification CSS Box Alignment</a></li> <li>La propriété {{cssxref("align-content")}}</li> <li>La propriété {{cssxref("justify-content")}}</li> |