---
id: 5d822fd413a79914d39e98d5
title: Step 13
challengeType: 0
dashedName: step-13
---
# --description--
Give your `.bb1` element these style properties: `display: flex;`, `flex-direction: column;`, and `align-items: center;`. This will center the parts of the building using "flex" or "flexbox". You will learn about it in more detail on another project.
# --hints--
You should not change the `.bb1` `width` or `height` properties.
```js
const bb1Style = new __helpers.CSSHelp(document).getStyle('.bb1');
assert.equal(bb1Style?.width, '10%');
assert.equal(bb1Style?.height, '70%');
```
You should give the `.bb1` element a `display` of `flex`.
```js
const bb1Style = new __helpers.CSSHelp(document).getStyle('.bb1');
assert.equal(bb1Style?.display, 'flex');
```
You should give the `.bb1` element a `flex-direction` of `column`.
```js
const bb1Style = new __helpers.CSSHelp(document).getStyle('.bb1');
assert.equal(bb1Style?.flexDirection, 'column');
```
You should give the `.bb1` element a `align-items` of `center`.
```js
const bb1Style = new __helpers.CSSHelp(document).getStyle('.bb1');
assert.equal(bb1Style?.alignItems, 'center');
```
# --seed--
## --seed-contents--
```html
City Skyline