I was looking through the CSS Div Layout section, and browsed through the code:

body { margin-top: 0; margin-bottom: 0; margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }

#menu { position: absolute; right: 5px; padding: 0px; width: 150px;}

When we set this div layout up, we achieve a right column (I removed the content layout tab, to conserve space), but how exactly does the 5px absolute positioning work? Does this create a 5px gap from the right side for this div layer? If I had a black body background color and I set the right column's background color to white, would this right column have a 5px gap from it's right? Wouldn't it be easier to set position: center right, and then set its width?


On a side note, what is the difference between padding: #; and margin: #; within the css div selector?

padding is the distance between the limit of the div layer and its content. Margin is the distance between the div layer and elements surrounding it.

#menu { position: absolute; right: 5px; padding: 0px; width: 150px;}

This will create a div positioned at 5 pixels from the right side of the browser, with a width of 150 pixels. If your body has a black background and your div a white background, the black will be seen in the 5 pixels gap on the right.

The "position" attribute can only have the following attributes: absolute, relative, fixed and static. I don't know much about the two latter. http://www.w3schools.com/css/pr_class_position.asp

Here's a tip, whenever I position my div's, I like it to be the same in every browser/resolution. So that's impossible right? No. When you're positioning a div layer you probably align it like this:
<div id="1" style="position:absolute; left:40px; top:50px;">Stuff in layer</div>

But that will only look good in the resolution you're in. So if you want your page to be cross-browser and cross-resolution compatible, you have to align your div's with the margin-left code:
<div id="1" style="position:absolute; left:50%; margin-left:50px; top:50px;">Stuff in layer</div>

When you use margin-left, you CAN use negative integers. Also when you use this, make sure you make left: 50%.

That's a handy tip, and thanks for the help djou.