2021-10-14 23:33:13 +01:00
---
id: 60f803d5241e6a0433a523a1
2021-10-21 10:07:52 -07:00
title: Step 14
2021-10-14 23:33:13 +01:00
challengeType: 0
2021-10-21 10:07:52 -07:00
dashedName: step-14
2021-10-14 23:33:13 +01:00
---
# --description--
As `label` elements are `inline` by default, they appear on the same line as the text they are labelling. To make them appear on separate lines, add `display: block` to the `label` element, and add a `margin` of `0.5rem 0` , to separate them from each other.
# --hints--
You should use the `label` selector.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('label'));
```
You should add a `display` property of value `block` .
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('label')?.display, 'block');
```
You should add a `margin` property of value `0.5rem 0` .
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('label')?.margin, '0.5rem 0px');
```
# --seed--
## --seed-contents--
```html
<!DOCTYPE html>
< html >
< head >
2022-03-14 15:54:43 +00:00
< title > Registration Form< / title >
2021-10-14 23:33:13 +01:00
< link rel = "stylesheet" type = "text/css" href = "styles.css" / >
< / head >
< body >
< h1 > Registration Form< / h1 >
< p > Please fill out this form with the required information< / p >
< form action = 'https://fcc-registration-form.com' >
< fieldset >
< label > Enter Your First Name:< / label >
< label > Enter Your Last Name:< / label >
< label > Enter Your Email:< / label >
< label > Create a New Password:< / label >
< / fieldset >
< fieldset > < / fieldset >
< fieldset > < / fieldset >
< / form >
< / body >
< / html >
```
```css
body {
width: 100%;
height: 100vh;
margin: 0;
background-color: #1b1b32 ;
color: #f5f6f7 ;
}
--fcc-editable-region--
--fcc-editable-region--
```
