---
id: bad87fee1348bd9aedf06756
title: Override Class Declarations with Inline Styles
challengeType: 0
videoUrl: 'https://scrimba.com/c/cGJDRha'
---
## Description
So we've proven that id declarations override class declarations, regardless of where they are declared in your style
element CSS.
There are other ways that you can override CSS. Do you remember inline styles?
## Instructions
Use an inline style
to try to make our h1
element white. Remember, in line styles look like this:
<h1 style="color: green;">
Leave the blue-text
and pink-text
classes on your h1
element.
## Tests
```yml
tests:
- text: Your h1
element should have the class pink-text
.
testString: assert($("h1").hasClass("pink-text"), 'Your h1
element should have the class pink-text
.');
- text: Your h1
element should have the class blue-text
.
testString: assert($("h1").hasClass("blue-text"), 'Your h1
element should have the class blue-text
.');
- text: Your h1
element should have the id of orange-text
.
testString: assert($("h1").attr("id") === "orange-text", 'Your h1
element should have the id of orange-text
.');
- text: Give your h1
element an inline style.
testString: assert(document.querySelector('h1[style]'), 'Give your h1
element an inline style.');
- text: Your h1
element should be white.
testString: assert($("h1").css("color") === "rgb(255, 255, 255)", 'Your h1
element should be white.');
```
## Challenge Seed
## Solution
```js
// solution required
```