2019-11-04 21:01:05 -06:00
---
id: 5d822fd413a79914d39e98e2
2021-10-21 10:07:52 -07:00
title: Step 26
2019-11-04 21:01:05 -06:00
challengeType: 0
2021-10-21 10:07:52 -07:00
dashedName: step-26
2019-11-04 21:01:05 -06:00
---
2020-11-27 19:02:05 +01:00
# --description--
2019-11-04 21:01:05 -06:00
2020-11-27 19:02:05 +01:00
Now that you've worked the bugs out and the buildings are the right colors, you can remove the fallback values in the two places they were used. Go ahead and do that now.
2019-11-04 21:01:05 -06:00
2020-11-27 19:02:05 +01:00
# --hints--
2021-07-16 04:46:40 +01:00
You should remove the fallback in the `background-color` from `.bb2` .
2020-11-27 19:02:05 +01:00
```js
2021-07-16 04:46:40 +01:00
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2')?.backgroundColor, 'var(--building-color2)');
```
You should remove the fallback in the `background-color` from `.bb3` .
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb3')?.backgroundColor.trim(), 'var(--building-color3)');
2019-11-04 21:01:05 -06:00
```
2020-11-27 19:02:05 +01:00
# --seed--
2019-11-04 21:01:05 -06:00
2020-11-27 19:02:05 +01:00
## --seed-contents--
2019-11-04 21:01:05 -06:00
```html
<!DOCTYPE html>
< html >
< head >
2022-03-14 15:54:43 +00:00
< title > City Skyline< / title >
2021-07-16 04:46:40 +01:00
< link href = "styles.css" rel = "stylesheet" type = "text/css" / >
2019-11-04 21:01:05 -06:00
< / head >
< body >
< div class = "background-buildings" >
< div > < / div >
< div > < / div >
< div class = "bb1" >
< div class = "bb1a" > < / div >
< div class = "bb1b" > < / div >
< div class = "bb1c" > < / div >
< div class = "bb1d" > < / div >
< / div >
< div class = "bb2" > < / div >
< div class = "bb3" > < / div >
< div > < / div >
< div class = "bb4" > < / div >
< div > < / div >
< div > < / div >
< / div >
< / body >
< / html >
```
2021-07-16 04:46:40 +01:00
```css
:root {
--building-color1: #aa80ff ;
--building-color2: #66cc99 ;
--building-color3: #cc6699 ;
}
* {
border: 1px solid black;
box-sizing: border-box;
}
body {
height: 100vh;
margin: 0;
overflow: hidden;
}
.background-buildings {
width: 100%;
height: 100%;
display: flex;
align-items: flex-end;
justify-content: space-evenly;
}
.bb1 {
width: 10%;
height: 70%;
display: flex;
flex-direction: column;
align-items: center;
}
.bb1a {
width: 70%;
height: 10%;
background-color: var(--building-color1);
}
.bb1b {
width: 80%;
height: 10%;
background-color: var(--building-color1);
}
.bb1c {
width: 90%;
height: 10%;
background-color: var(--building-color1);
}
.bb1d {
width: 100%;
height: 70%;
background-color: var(--building-color1);
}
--fcc-editable-region--
.bb2 {
width: 10%;
height: 50%;
background-color: var(--building-color2, green);
}
.bb3 {
width: 10%;
height: 55%;
background-color: var(--building-color3, pink);
}
--fcc-editable-region--
.bb4 {
width: 11%;
height: 58%;
}
2019-11-04 21:01:05 -06:00
```
