--- id: 5f3ef6e05473f91f948724ab title: Step 58 challengeType: 0 dashedName: step-58 --- # --description-- You can change the `font-family` of text, to make it look different from the default font of your browser. Each browser has some common fonts available to it. Change all the text in your `body`, by adding a `font-family` property with the value `sans-serif`. This is a fairly common font that is very readable. # --hints-- You should set the `font-family` property to `sans-serif`. ```js const hasFontFamily = new __helpers.CSSHelp(document).getCSSRules().some(x => x.style['font-family'] === 'sans-serif'); ``` Your `body` should have a `font-family` of `sans-serif`. ```js const bodyFontFamily = new __helpers.CSSHelp(document).getStyle('body')?.getPropertyValue('font-family'); assert(bodyFontFamily === 'sans-serif'); ``` # --seed-- ## --seed-contents-- ```html Cafe Menu ``` ```css --fcc-editable-region-- body { background-image: url(https://cdn.freecodecamp.org/curriculum/css-cafe/beans.jpg); } --fcc-editable-region-- h1, h2, p { text-align: center; } .menu { width: 80%; background-color: burlywood; margin-left: auto; margin-right: auto; padding: 20px; max-width: 500px; } .item p { display: inline-block; } .flavor, .dessert { text-align: left; width: 75%; } .price { text-align: right; width: 25% } ```