---
id: 5f3ef6e03d719d5ac4738993
title: Step 57
challengeType: 0
dashedName: step-57
---
# --description--
The current width of the menu will always take up 80% of the `body` element's width. On a very wide screen, the coffee and dessert appear far apart from their prices.
Add a `max-width` property to the `menu` class with a value of `500px` to prevent it from growing too wide.
# --hints--
You should set the `max-width` property to `500px`.
```js
const hasMaxWidth = new __helpers.CSSHelp(document).getCSSRules().some(x => x.style['max-width'] === '500px');
assert(hasMaxWidth);
```
Your `.menu` element should have a `max-width` of `500px`.
```js
const menuMaxWidth = new __helpers.CSSHelp(document).getStyle('.menu')?.getPropertyValue('max-width');
assert(menuMaxWidth === '500px');
```
# --seed--
## --seed-contents--
```html
Cafe Menu