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

Posted by Kate Roberts
Kate Roberts
Courses Plus Student 1,068 Points

CSS Grids (gridulator)

Hi,

I have never used grids before and have been going over the 'build a simple website' course to brush up on my skills and learn how a grid can be used when coding.

I am trying to experiment on making a basic page using the grid system to cement my learning, but am a little stuck. This might sound a little silly, but say I want to center a div in the middle of the page and it is 6 columns wide, do I have to add a div before and after it 3 columns wide each to centre it even though they wont hold content or is there another way to do it?

Thank you so much for all of your help!

K

5 Answers

Elliott Frazier
PLUS
Elliott Frazier
Courses Plus Student 9,647 Points
Elliott Frazier
Elliott Frazier
Courses Plus Student 9,647 Points 
<div class="grid_12" style="text-align: center;">

Hope it helps!

Kate Roberts
PLUS
Kate Roberts
Courses Plus Student 1,068 Points
Kate Roberts
Kate Roberts
Courses Plus Student 1,068 Points

Thanks Elliot I appreciate your help.

I've tried to center it by doing the following:

<div class="grid_2"></div>
<div class="grid_8"></div>
<div class="grid_2"></div>

This works, however the first and last div aren't going to contain anything and i don't want to write code that isn't necessary. Would there be another way of getting around it, or is this the "standard" when using grids to lay out your content?

thanks again

Sher K
PLUS
Sher K
Courses Plus Student 1,316 Points
Sher K
Sher K
Courses Plus Student 1,316 Points

I'm not getting the grid concept at all? How many grid can we use per page? Sizes? Is there a limit? How do we divide grids on a page? Is this something we will be learning in our next stages?

Thanks in advance :)

Elliott Frazier
PLUS
Elliott Frazier
Courses Plus Student 9,647 Points
Elliott Frazier
Elliott Frazier
Courses Plus Student 9,647 Points

positioning with floats and other methods will be explained with great detail for laying out a website in the next stages.

Sher K
PLUS
Sher K
Courses Plus Student 1,316 Points
Sher K
Sher K
Courses Plus Student 1,316 Points

Thank you :)