Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript React Basics First Steps in React Understanding JSX

Getting errors and also no CSS is being applied

I have no idea where the problem could have came from so I actually just downloaded the finished code of this video and pasted it over my code and am still getting the same errors. Also the CSS has never been applied whenever I tried to open it. the errors are:

Warning: validateDOMNesting(...): <h1> cannot appear as a descendant of <p>. in h1 in p warningWithoutStack @ react-dom.development.js:500 react-dom.development.js:500 Warning: validateDOMNesting(...): <p> cannot appear as a descendant of <p>. in p in p warningWithoutStack @ react-dom.development.js:500

I have used http-server and python -m SimpleHTTPServer 8000 to look at the page and I've opened it in Chrome and Firefox and still have these errors and no CSS applied. Does anyone know how to fix this?

10,980 Points

It'll help to see your code

1 Answer

For your first error it seems that you have a <h1> as a child of a <p> . Swapping the order and making the <p> a child of <h1> should do it.