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.

HTML

trouble with grids...

So I want to know... when I am using sublime text 2 as a text editor and it has been fine up to now but when I try to get the page into a grid from the right and left handside... it doesnt change. I have opened a html and a css file on my text editor and i have copied the code from the project files (for the css part) but still no luck..

4 Answers

James Barnett
James Barnett
39,199 Points

Mustafa Kasim -

You need 3 things here:

  • To have downloaded the grid.css file from the Project Files zip
  • Have the correct syntax in your <link> tag
  • To be using the correct file path for where you put the grid.css file

If it's a file path issue, here's a good tutorial on file paths

Andi Wilkinson
Andi Wilkinson
26,822 Points

have you linked in grid.css in the head of your document?

<link rel="stylesheet" href="css/grid.css" type="text/css" media="screen">

and have you put in the appropriate classes to the divs. - for example,

<div class="grid_4">

Hi, Yes I have

and the div class is supposed to equal "container" right....?

Still no luck...

Andi Wilkinson
Andi Wilkinson
26,822 Points

linking in the stylesheet, there are various styles it will use,

  • a class of container eg

    <div class="container">

will centre the content and wrap it in 1000 pixel container

<div class="grid_6"> will make the div half the width of the container. 

you do have the stylesheet downloaded and in the right file dont you? - ie you aren't just linking to nothing?

Andi Wilkinson
Andi Wilkinson
26,822 Points

you should have downloaded a file called grid.css. - this should have all the styles you are referencing, if you have just created one called grid.css and copied in the styles mentioned in the exercise, that is where you will be going wrong.

there are three css files in use here. normalize.css which is used by many web developers to reset the css before you start to make your own changes grid.css is a 12 col grid system, with many styles written in for you to save you all that calculating, and style.css - the one you make and add your own styles in.

assuming you are linking to all three in the head of your document, and that all three exist in your file, with the right info in them, it all should work nicely :)

Hi!

Im sorry,

but did you say that there are 3 files in use..?

I thought that i only had to use grid.css and normalize.css..?

Where do I download the style.css?

Thanks