2022-06-06 14:55:35 +00:00
---
id: 612e9d142affc44a453655db
title: Step 16
challengeType: 0
dashedName: step-16
---
# --description--
È tempo di impostare lo stile dei tasti stessi. Crea un selettore per l'attributo `class` con il valore `.key` . Imposta `background-color` su `#ffffff` , `position` su `relative` , `width` a `41px` e `height` a `175px` .
# --hints--
Dovresti avere un selettore `.key` .
```js
assert(new __helpers.CSSHelp(document).getStyle('.key'));
```
Il selettore `.key` dovrebbe avere una proprietà `background-color` impostata su `#ffffff` .
```js
assert(new __helpers.CSSHelp(document).getStyle('.key')?.backgroundColor === 'rgb(255, 255, 255)');
```
Il selettore `.key` dovrebbe avere la proprietà `position` impostata su `relative` .
```js
assert(new __helpers.CSSHelp(document).getStyle('.key')?.position === 'relative');
```
Il selettore `.key` dovrebbe avere una proprietà `width` impostata a `41px` .
```js
assert(new __helpers.CSSHelp(document).getStyle('.key')?.width === '41px');
```
Il selettore `.key` dovrebbe avere una proprietà `height` impostata a `175px` .
```js
assert(new __helpers.CSSHelp(document).getStyle('.key')?.height === '175px');
```
# --seed--
## --seed-contents--
```html
<!DOCTYPE html>
2022-06-30 15:24:09 +00:00
< html lang = "en" >
2022-06-06 14:55:35 +00:00
< head >
< meta charset = "UTF-8" / >
< title > Piano< / title >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" / >
< link rel = "stylesheet" href = "./styles.css" >
< / head >
< body >
< div id = "piano" >
< div class = "keys" >
< div class = "key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key black--key" > < / div >
< div class = "key black--key" > < / div >
< / div >
< / div >
< / body >
< / html >
```
```css
html {
box-sizing: border-box;
}
*, *::before, * ::after {
box-sizing: inherit;
}
#piano {
background-color: #00471b ;
width: 992px;
height: 290px;
margin: 80px auto;
padding: 90px 20px 0 20px;
}
.keys {
background-color: #040404 ;
width: 949px;
height: 180px;
padding-left: 2px;
}
--fcc-editable-region--
--fcc-editable-region--
```
