diff options
Diffstat (limited to 'files/fr/web/css/overflow-clip-box-block')
| -rw-r--r-- | files/fr/web/css/overflow-clip-box-block/index.html | 157 |
1 files changed, 0 insertions, 157 deletions
diff --git a/files/fr/web/css/overflow-clip-box-block/index.html b/files/fr/web/css/overflow-clip-box-block/index.html deleted file mode 100644 index 54c60574d8..0000000000 --- a/files/fr/web/css/overflow-clip-box-block/index.html +++ /dev/null @@ -1,157 +0,0 @@ ---- -title: overflow-clip-box-block -slug: Web/CSS/overflow-clip-box-block -tags: - - CSS - - Non-standard - - Propriété - - Reference -translation_of: Mozilla/Gecko/Chrome/CSS/overflow-clip-box-block ---- -<div>{{CSSRef}}{{Non-standard_header}}</div> - -<p>La propriété CSS <strong><code>overflow-clip-box-block</code></strong> définit par rapport à quelle boîte est appliqué le rognement lorsque le contenu dépasse dans la direction de bloc (la direction orthogonale au sens d'écriture).</p> - -<pre class="brush:css no-line-numbers">/* Valeurs avec un mot-clé */ -overflow-clip-box-block: padding-box; -overflow-clip-box-block: content-box; - -/* Valeurs globales */ -overflow-clip-box-block: inherited; -overflow-clip-box-block: initial; -overflow-clip-box-block: unset; -</pre> - -<div class="note"> -<p><strong>Note :</strong> Sur Gecko, <code>padding-box</code> est, par défaut utilisé partout sauf pour <code><input type="text"></code> et les éléments semblables qui utilisent <code>content-box</code>. Par défaut, cette propriété est uniquement activée pour les feuilles de style de l'agent utilisateur et le contexte du chrome.</p> -</div> - -<p>{{cssinfo}}</p> - -<h2 id="Syntaxe">Syntaxe</h2> - -<h3 id="Valeurs">Valeurs</h3> - -<dl> - <dt><code>padding-box</code></dt> - <dd>Avec ce mot-clé, le rognage est relatif à <a href="/fr/Apprendre/CSS/Introduction_%C3%A0_CSS/Le_mod%C3%A8le_de_bo%C3%AEte#Les_propri%C3%A9t%C3%A9s_des_bo%C3%AEtes">la boîte de remplissage (<em>padding</em>)</a>.</dd> - <dt><code>content-box</code></dt> - <dd>Avec ce mot-clé, le rognage est relatif à <a href="/fr/Apprendre/CSS/Introduction_%C3%A0_CSS/Le_mod%C3%A8le_de_bo%C3%AEte#Les_propri%C3%A9t%C3%A9s_des_bo%C3%AEtes">la boîte de contenu</a>.</dd> -</dl> - -<h3 id="Syntaxe_formelle">Syntaxe formelle</h3> - -<pre class="syntaxbox">{{csssyntax}}</pre> - -<h2 id="Exemples">Exemples</h2> - -<h3 id="padding-box">padding-box</h3> - -<h4 id="HTML">HTML</h4> - -<pre class="brush: html"><div class="things"> - <input value="ABCDEFGHIJKLMNOPQRSTUVWXYZÅÄÖ" class="scroll padding-box"> - <div class="scroll padding-box"><span>ABCDEFGHIJKLMNOPQRSTUVWXYZÅÄÖ</span></div> -</div> -</pre> - -<h4 id="CSS">CSS</h4> - -<pre class="brush: css">.scroll { - overflow: auto; - padding: 0 30px; - width: 6em; - border: 1px solid black; - background: lime content-box; -} - -.padding-box { - overflow-clip-box-block: padding-box; -}</pre> - -<h4 id="JavaScript">JavaScript</h4> - -<pre class="brush: js">function scrollSomeElements() { - var elms = document.querySelectorAll('.scroll'); - for (i=0; i < elms.length; ++i) { - elms[i].scrollLeft=80; - } -} -var elt = document.queryElementsByTagName('body')[0]; - -elt.addEventListener("load", scrollSomeElements, false); -</pre> - -<h4 id="Résultat">Résultat</h4> - -<p>{{EmbedLiveSample('padding-box')}}</p> - -<h2 id="Spécifications">Spécifications</h2> - -<p>Cette propriété a été proposée au groupe de travail CSSWG du W3C. Elle n'est pas encore en voie de standardisation mais devrait apparaître dans {{SpecName("CSS3 Overflow")}} si c'est le cas.</p> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<p>{{CompatibilityTable}}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Fonctionnalité</th> - <th>Firefox (Gecko)</th> - <th>Chrome</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari (WebKit)</th> - </tr> - <tr> - <td>Support simple</td> - <td>{{CompatGeckoDesktop(59)}}<sup>[1]</sup></td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Fonctionnalité</th> - <th>Firefox Mobile (Gecko)</th> - <th>Android</th> - <th>IE Phone</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Support simple</td> - <td>{{CompatGeckoMobile(59)}}<sup>[1]</sup></td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - -<p>[1] Cette propriété est contrôlée par la préférence <code>layout.css.overflow-clip-box.enabled</code> dont la valeur par défaut est <code>false</code>. Elle est uniquement activée pour les feuilles de style de l'agent utilisateur ou le contexte du chrome. Voir {{bug(966992)}}.</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li>{{cssxref("text-overflow")}},</li> - <li>{{cssxref("white-space")}},</li> - <li>{{cssxref("overflow")}},</li> - <li>{{cssxref("overflow-x")}},</li> - <li>{{cssxref("overflow-y")}},</li> - <li>{{cssxref("clip")}},</li> - <li>{{cssxref("display")}}</li> -</ul> - -<p> </p> |