diff options
Diffstat (limited to 'files/de/web/css/object-position/index.html')
| -rw-r--r-- | files/de/web/css/object-position/index.html | 147 |
1 files changed, 0 insertions, 147 deletions
diff --git a/files/de/web/css/object-position/index.html b/files/de/web/css/object-position/index.html deleted file mode 100644 index d42372ad90..0000000000 --- a/files/de/web/css/object-position/index.html +++ /dev/null @@ -1,147 +0,0 @@ ---- -title: object-position -slug: Web/CSS/object-position -translation_of: Web/CSS/object-position ---- -<div>{{CSSRef}}</div> - -<p>Die Eigenschaft <strong><code>object-position </code></strong>bestimmt die Ausrichtung des Elements in seiner Box.</p> - -<pre class="brush:css no-line-numbers">/* <position> Werte */ -object-position: 100px 50px; - -/* Globale Werte */ -object-position: inherit; -object-position: initial; -object-position: unset; -</pre> - -<p>{{cssinfo}}</p> - -<h2 id="Syntax" name="Syntax">Syntax</h2> - -<h3 id="Values" name="Values">Values</h3> - -<dl> - <dt><code><position></code></dt> - <dd>Is a {{ cssxref("<position>") }}, that is one to four values representing a 2D position regarding the edges of the element's box. Relative or absolute offsets can be given. Note that the position can be set outside of the element's box.</dd> -</dl> - -<h3 id="Formal_syntax">Formal syntax</h3> - -{{csssyntax}} - -<h2 id="Example" name="Example">Example</h2> - -<h3 id="HTML_content">HTML content</h3> - -<pre class="brush: html"><img id="object-position-1" src="https://mdn.mozillademos.org/files/12668/MDN.svg" alt="MDN Logo"/> -<img id="object-position-2" src="https://mdn.mozillademos.org/files/12668/MDN.svg" alt="MDN Logo"/> -</pre> - -<h3 id="CSS_content">CSS content</h3> - -<pre class="brush: css">img { - width: 300px; - height: 250px; - border: 1px solid black; - background-color: silver; - margin-right: 1em; - object-fit: none; -} - -#object-position-1 { - object-position: 10px; -} - -#object-position-2 { - object-position: 100% 10%; -} -</pre> - -<h3 id="Output">Output</h3> - -<p>{{ EmbedLiveSample('Example', '100%','300px') }}</p> - -<h2 id="Specifications" name="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS4 Images', '#the-object-position', 'object-position')}}</td> - <td>{{Spec2('CSS4 Images')}}</td> - <td>The <code>from-image</code> and <code>flip</code> keywords have been added.</td> - </tr> - <tr> - <td>{{SpecName('CSS3 Images', '#the-object-position', 'object-position')}}</td> - <td>{{Spec2('CSS3 Images')}}</td> - <td>Initial definition</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2> - -<p>{{ CompatibilityTable }}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>31.0</td> - <td>{{ CompatGeckoDesktop("36") }}</td> - <td>{{CompatNo}}</td> - <td>11.60{{ property_prefix("-o") }}<br> - 19.0</td> - <td>10.0</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>4.4.4</td> - <td>{{ CompatGeckoDesktop("36") }}</td> - <td>{{CompatNo}}</td> - <td>11.5{{ property_prefix("-o") }}<br> - 24</td> - <td>{{ CompatNo }}</td> - </tr> - </tbody> -</table> -<br> -[1] WebKit Nightly fixed in bug <a href="https://bugs.webkit.org/show_bug.cgi?id=122811">122811</a>.</div> - -<h2 id="See_also" name="See_also">See also</h2> - -<ul> - <li>Other image-related CSS properties: {{cssxref("object-fit")}}, {{cssxref("image-orientation")}}, {{cssxref("image-rendering")}}, {{cssxref("image-resolution")}}.</li> -</ul> |