1.1 KiB

Raw Blame History

id	title	challengeType	videoUrl	forumTopicId	dashedName
587d78a3367417b2b2512ad0	Center an Element Horizontally Using the margin Property	0	https://scrimba.com/c/cyLJqU4	301043	center-an-element-horizontally-using-the-margin-property

--description--

Another positioning technique is to center a block element horizontally. One way to do this is to set its margin to a value of auto.

This method works for images, too. Images are inline elements by default, but can be changed to block elements when you set the display property to block.

--instructions--

Center the div on the page by adding a margin property with a value of auto.

--hints--

The div should have a margin set to auto.

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>

1.1 KiB Raw Blame History