Question

I have a setup like this: http://jsfiddle.net/zzjSC/3/ and I am wondering why the surrounding div with the 1px black border does not affect the contents.
My main goal is centering the whole mess which is what I was trying to do with the div and yet it doesn’t seem to be doing anything. Is there any clean way to center it?

Answer 1

When you use the margin:0 auto; centering trick on a block level element like a div, you also have to give it a width. BTW, change your margin from auto 0px to 0 auto. The way you have it you’re giving the top and bottom a value of auto and left and right a value of 0px.

The following CSS (you may need to change the width) should do it.

.right-align {
    margin: 0px auto;
    border: 1px solid black;
    position: relative;
    width: 1036px;
}