---
id: 61fdac1e31692f9a9ad97295
title: Step 31
challengeType: 0
dashedName: step-31
---
# --description--
The CSS `clip` property is used to define the visible portions of an element. Set the `span[class~="sr-only"]` selector to have a `clip` property of `rect(1px, 1px, 1px, 1px)`.
The `clip-path` property determines the shape the `clip` property should take. Use both the `clip-path` and `-webkit-clip-path` selectors to set the value to `inset(50%)`, forming the clip-path into a rectangle within the element.
# --hints--
Your `span[class~="sr-only"]` selector should have a `clip` property set to `rect(1px, 1px, 1px, 1px)`.
```js
assert(new __helpers.CSSHelp(document).getStyle('span[class~="sr-only"]')?.getPropertyValue('clip') === 'rect(1px, 1px, 1px, 1px)');
```
Your `span[class~="sr-only"] ` selector should have a `clip-path` property set to `inset(50%)`.
```js
assert(new __helpers.CSSHelp(document).getStyle('span[class~="sr-only"]')?.getPropertyValue('clip-path') === 'inset(50%)');
```
Your `span[class~="sr-only"]` selector should have a `-webkit-clip-path` property set to `inset(50%)`.
```js
assert(/-webkit-clip-path\s*:\s*inset\(\s*50%\s*\)\s*(;|})/.test(code));
```
# --seed--
## --seed-contents--
```html
Balance Sheet
AcmeWidgetCorpBalance Sheet
201920202021
Assets
2019
2020
2021
Cash This is the cash we currently have on hand.
$25
$30
$28
Checking Our primary transactional account.
$54
$56
$53
Savings Funds set aside for emergencies.
$500
$650
$728
Total Assets
$579
$736
$809
Liabilities
2019
2020
2021
Loans The outstanding balance on our startup loan.
$500
$250
$0
Expenses Annual anticipated expenses, such as payroll.
$200
$300
$400
Credit The outstanding balance on our credit card.