1.2 KiB
1.2 KiB
id | title | challengeType | videoUrl | forumTopicId | dashedName |
---|---|---|---|---|---|
587d78a3367417b2b2512ad0 | Ein Element mithilfe der Margin-Eigenschaft horizontal zentrieren | 0 | https://scrimba.com/c/cyLJqU4 | 301043 | center-an-element-horizontally-using-the-margin-property |
--description--
Eine weitere Positionierungstechnik ist es, ein Block-Element horizontal zu zentrieren. Beispielsweise, in dem man seine margin
auf einen Wert 'auto' setzt.
Diese Methode funktioniert auch für Bilder. Sie sind standardmäßig Inline-Elemente, die in Block-Elemente geändert werden können, indem man die display
-Eigenschaft auf block
setzt.
--instructions--
Zentriere das div
auf dieser Seite, indem du eine margin
-Eigenschaft mit einem Wert von auto
hinzufügst.
--hints--
Das div
sollte eine margin
mit einem Wert von auto
haben.
assert(new __helpers.CSSHelp(document).getStyle('div')?.margin === 'auto');
--seed--
--seed-contents--
<style>
div {
background-color: blue;
height: 100px;
width: 100px;
}
</style>
<div></div>
--solutions--
<style>
div {
background-color: blue;
height: 100px;
width: 100px;
margin: auto;
}
</style>
<div></div>