I don't understand how to do this

JavaScript
1

Tell us what’s happening:

Your code so far


class Colorful extends React.Component {
render() {
  return (
    <div> style={{ color: 'red', fontSize: '72'}}>
      Big Red
    </div>
  );
}
};

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.89 Safari/537.36 Edg/84.0.522.44.

Challenge: Introducing Inline Styles

Link to the challenge:

2

Just a quick guess: Perhaps you need to remove the closing caret after <div because the style attribute belongs inside the opening div style="" tag

1 Like
3

Hey there,

style is an attribute you can add to an HTML element.

So when you want to add an attribute to an HTML element,
you have to add the attribute to the opening tag

HTML element without attribute: <div>...</div>
HTML element with one attribute: <div style="">...</div>

Now the style attribute belongs to the div, because you added it to the opening tag <div>.

Same goes for other HTML elements: <p style="">...</p>

1 Like