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.

CSS Responsive Layouts Responsive Patterns Flexbox

How to implement this example in my own text editor?


I'm trying to copy and paste the code from the responsive layouts tutorial in sublime text editor 2 to follow along with the examples, but for some reason the browser never appears to show the full "theme" as it does in workspaces. Do I need to include the normalize.min.css and the treehouse-white.svg files? Maybe I missed this somewhere, but why do we need normalize.min.css? Was this covered? And when I do include both files, it still does not show all the elements. Any help would be greatly appreciated. Thank you.

2 Answers

TJ Nuccio
TJ Nuccio
5,036 Points

Hey Oscar,

Normalize.css is known as a CSS reset. The purpose of this reset is to target basic rendering differences amongst various browsers in an effort to improve browser cross-compatibility with your website. The normalize.css file should be included in the <head> tags BEFORE your main.css file. You want the browser to load normalize.css first in order to set up your main.css file for optimal performance!

If you are using the text editor of your preference (i.e, NOT workspaces) then you will want to download all of the project files attached to the responsive layouts course that you are currently working on, You want to include all files, including CSS files, images, etc., in the same directory (folder) as your index.html file to ensure that they are loaded properly.

There is a chance that it could just be one simple character that is causing something to be all out of whack! HTML and CSS (and all markup/coding languages) are extremely delicate, and have to be meticulously scanned for any small little errors.

Sorry if I went through some stuff you already know! Didn't want to miss anything.

Also, if you're still having any trouble, please consider posting code snippets of your HTML/CSS and I'd love to help more!

Happy learning, TJ

Nathan Ward
Nathan Ward
7,895 Points

You will need a full copy of all the files in the same folder structure for this to work, check the developer console for errors as a file may not be loading correctly.