How do you set up your initial site divs?

[enim]

I was helping a friend not fail her webdev class, which was extremely basic, and she basically just had to make a few pages, and use CSS.  When I got there, her page was a huge mess, so I had her draw what she wanted on paper, then we got to coding.  

 

The way I showed her to do it was by setting a div for each part she wanted, inside a wrap/body div (requirement of the course for some reason), naming each one what it would be.  Then, in setting up the CSS, i made her set each one to an ugly color with an uglier border, so we knew where they all went.  I found this real easy to get everything lined up, but I'm sure there is a better way.  Any bright ideas?

[OhioTom76]

That sounds about right. The border is not entirely necessary though, and personally I would leave those off. Placing a border (or padding) on a DIV will force it to clear when floated. That's all fine and dandy, but the moment you remove the padding and the border, elements will start collapsing and looking all messed up. I like to make sure all my DIV's that are floated or contain floated DIV's are properly cleared an can hold up to any scenario (no border, no padding, etc..).

 

Are you working in a recent copy of Dreamweaver per chance? If so, they've got some great tools for building responsive layouts - I may even suggest introducing her to that.