Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Karen Rae
Karen Rae
1,963 Points

Adding CSS

I have downloaded the downloads and have opened the index file which gave me the browser page but I cannot find the file setup Guil talks about in which there is a simple HTML file. How do I get this open?

4 Answers

Hayden Taylor
Hayden Taylor
5,076 Points

Could you give a better description of the problem? I am assuming you can't find the css (style sheet) file? After downloading the packaged source code --> adding-css? click into start or final and then click into the folder called css. If you don't understand how its being linked to the html file... you can open up the file called index.html in a text editor (sublime is recommended) and you will see some lines near the top like so:

 <link rel="stylesheet" href="css/style.css">

 <style type="text/css">
    h1 {
        color: white;
        background-color: #E14607;
    }
</style>

each of these lines allows css (styles) to be added to the page. The first line "<link rel...." is how to link a style sheet from another file.

The second version "<style type=......" is how you can put styles in the same page as the html.

Best practice calls for separation.

The simple html file I think is the index.html and if you want to see the code open in a text editor (notepad on windows textmate on mac).

I don't know if this is even what you are asking for.

Karen Rae
Karen Rae
1,963 Points

It is what I'm asking for ... thanks Hayden. My problem is I don't know HOW to open it in a text editor as the file only gives me the option to open it not Open with ... so all I can get is it in Browser mode. I know I'm just illiterate in something & look forward to being enlightened :-)

Hayden Taylor
Hayden Taylor
5,076 Points

Alright so are you running windows or mac? On windows when you right click on the file open with notepad or search for "notepad.exe" on mac with you right click on it and go to open with you should see "TextEdit" if not click other and search the list of applications for a text editor TextEdit should be in there. If you are serious about learning and coding web pages you should download a real editor like sublime text http://www.sublimetext.com/2 here is the link. It is free but every 5 saves it will ask you to pay you can ignore that but if you like it enough you should buy a copy.

I am on a mac so its hard for me to give windows instructions. Just post back if you need more help.

Karen Rae
Karen Rae
1,963 Points

I've got sublime text. My problem is that for some reason when I open the file it is already a committed Firefox (html) document and I only get the option to open it in that format. I think its something to do with how I download it and unzip it. All I am doing at the moment and which is not working is downloading it. Double clicking the zipped file in my downloads folder and there is the index file already as a Firefox entity. I know this is super basic ... I just need to know it :-))))

Karen Rae
Karen Rae
1,963 Points

Oh Haydn, I found it! I started watching a tutorial on using Sublime Text & he showed me just to chuck the file onto the open Sublime Text document and ..... voila! I got it!!!!! I knew it was easy hahaha! Thank you so much for trying to help me. I very much appreciate your attention!

Hayden Taylor
Hayden Taylor
5,076 Points

Awesome, good to hear... Happy Coding