Comments on: 2-Column, Center-aligned Fixed Width Layout with CSS

By: Chris

Chris — Thu, 07 Mar 2013 18:07:42 +0000

Hey great tutorial… quick and to the point..doesn’t take 3 chapters to describe the basics

Maybe throw in a quick description of the CSS Box model to demonstrate the last section about padding pitfalls. Also I like to remember positioning with this little acronym / anecdote ” TRouBLe” Top Right Bottom Left or you’ll layout will be in some serious trouble….
margin: 5px 6px 7px 8px;

By: admin

admin — Tue, 05 Mar 2013 17:37:44 +0000

@danik,

Thanks!

Stef

By: danik

danik — Tue, 05 Mar 2013 16:42:38 +0000

very good tutorial and straight to the point, thanks a lot indeed and looking forward for more…
Just can’t wait to put into practice and also to subscribe and have access to the entire library!

By: Nathan Schobert

Nathan Schobert — Tue, 25 Oct 2011 19:47:27 +0000

I’ve been trying to make a simple two column layout for some time now, but I could never get the thing to center, what with the floats and fluid containers. I didn’t want to use absolute sizes because now if I change the padding, margins, or borders on the two columns, I have to readjust the sizes. Minor inconvenience I suppose, at least I finally have something workable. Thank you

By: Andrea Barnett

Andrea Barnett — Sun, 12 Jun 2011 12:08:14 +0000

Actually, header, etc are INSIDE the wrapper and the divisions just appear in their natural order, as I didn’t use CSS to direct them otherwise.

By: rajim

rajim — Sun, 12 Jun 2011 03:18:20 +0000

Pardon, i’m new on css and have a doubt with #header
in this tutorial, i didn’t see any #header css tag declared #header position, so how can it position automatically on top ? or above navigation and content.

i guess, header position set at html, below wrapper and above navigation and main content ? correct me if wrong

Thank you

By: Sumi

Sumi — Tue, 01 Feb 2011 12:03:05 +0000

Excellent tutorial….Put everything that was scattered all around in my head ordered into one place…..Thank you.

By: Andrea Barnett

Andrea Barnett — Fri, 31 Dec 2010 00:47:58 +0000

Thanks for the pointer, Nit Picker, I’ve made the wrapper issue a bit clearer and expanded on the sample coding shown. Does this help, or do you have more questions?

By: Nit Picker

Nit Picker — Thu, 30 Dec 2010 20:21:29 +0000

Hi, sorry to say the tutorial does not show in the sections of example code where to put the #wrapper div. Yes, maybe it is obvious, but for the sake of a tutorial I would hope for at least a verbal explanation. The closest I find is ‘…I’m adding a wrapper division around the entire body html…’.

Thanks!

By: Ashley R

Ashley R — Mon, 18 Oct 2010 21:06:48 +0000

Hi! Thanks for the tutorial; it was very helpful. I do have a question though – how can you make the navigation bar expand down the page 100%?
I am working on a site (although I’m a CSS newb) which I have a navigation bar that extends about half-way down the pages. This is ok and looks right for my home page where the content also only goes half-way down, but on other pages, the content extends farther than the length of the navigation bar. I would like the color of the navigation bar to extend all the way down the page. I tried
height:100%;
but this did not work. Any help? Thanks.