2021-12-03 14:20:34 -08:00
---
id: 6193fb8bef24145b57fbed00
title: Step 34
challengeType: 0
dashedName: step-34
---
# --description--
2022-01-08 10:53:47 -05:00
Now you'll need to adjust the layout of the dollar values. The CSS `:not()` selector allows you to target all elements matching a given selector *except* those which match the selector you provide within `:not()` .
2021-12-03 14:20:34 -08:00
Create a `span:not(.name)` selector to target all of your `span` elements except those with the `class` set to `name` . Give it a `margin-left` property set to `10px` and a `min-width` property set to `15%` .
# --hints--
You should have a new `span:not(.name)` selector.
```js
assert(new __helpers.CSSHelp(document).getStyle('span:not(.name)'));
```
Your `span:not(.name)` selector should have a `margin-left` property set to `10px` .
```js
assert(new __helpers.CSSHelp(document).getStyle('span:not(.name)')?.marginLeft === '10px');
```
Your `span:not(.name)` selector should have a `min-width` property set to `15%` .
```js
assert(new __helpers.CSSHelp(document).getStyle('span:not(.name)')?.minWidth === '15%');
```
# --seed--
## --seed-contents--
```html
<!DOCTYPE html>
< html >
< head >
< meta charset = "UTF-8" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" / >
< title > AcmeWidgetCorp Balance Sheet< / title >
< link rel = "stylesheet" type = "text/css" href = "./styles.css" / >
< / head >
< body >
< div id = "sheet" >
< div id = "header" >
< h1 > Balance Sheet< / h1 >
< h2 > AcmeWidgetCorp< / h2 >
< p class = "row" >
< span > 2019< / span >
< span > 2020< / span >
< span class = "current" > 2021< / span >
< / p >
< / div >
< h2 > Assets< / h2 >
< div class = "section" >
< p class = "row" >
< span class = "name" > Cash< / span >
< span > $25< / span >
< span > $30< / span >
< span class = "current" > $28< / span >
< / p >
< span class = "notes" > This is the cash we currently have on hand.< / span >
< p class = "row" >
< span class = "name" > Checking< / span >
< span > $54< / span >
< span > $56< / span >
< span class = "current" > $53< / span >
< / p >
< span class = "notes" > Our primary transactional account.< / span >
< p class = "row" >
< span class = "name" > Savings< / span >
< span > $500< / span >
< span > $650< / span >
< span class = "current" > $728< / span >
< / p >
< span class = "notes" > Funds set aside for emergencies.< / span >
< p class = "row total" >
< span class = "name" > Total< / span >
< span > $579< / span >
< span > $736< / span >
< span class = "current" > $809< / span >
< / p >
< / div >
< h2 > Liabilities< / h2 >
< div class = "section" >
< p class = "row" >
< span class = "name" > Loans< / span >
< span > $500< / span >
< span > $250< / span >
< span class = "current" > $0< / span >
< / p >
< span class = "notes" > The outstanding balance on our startup loan.< / span >
< p class = "row" >
< span class = "name" > Expenses< / span >
< span > $200< / span >
< span > $300< / span >
< span class = "current" > $400< / span >
< / p >
< span class = "notes" > Annual anticipated expenses, such as payroll.< / span >
< p class = "row" >
< span class = "name" > Credit< / span >
< span > $50< / span >
< span > $50< / span >
< span class = "current" > $75< / span >
< / p >
< span class = "notes" > The running balance on our line of credit.< / span >
< p class = "row total" >
< span class = "name" > Total< / span >
< span > $750< / span >
< span > $600< / span >
< span class = "current" > $475< / span >
< / p >
< / div >
< h2 > Net Worth< / h2 >
< div class = "section" >
< p class = "row total" >
< span class = "name" > Total< / span >
2021-12-22 20:18:06 +00:00
< span > -$171< / span >
2021-12-03 14:20:34 -08:00
< span > $136< / span >
< span class = "current" > $334< / span >
< / p >
< / div >
< / div >
< footer > Last Updated: December 2021< / footer >
< / body >
< / html >
```
```css
body {
text-align: center;
font-family: Tahoma;
color: #0a0a23 ;
}
#sheet {
text-align: left;
max-width: 500px;
margin: auto;
padding: 10px;
border: 2px solid #d0d0d5 ;
}
#header h2 {
font-size: 1.3em;
}
.row {
display: flex;
justify-content: flex-end;
}
--fcc-editable-region--
--fcc-editable-region--
.name {
width: 100%;
text-align: left;
}
```
