Column centering

HTML & CSS
1

Centering within a column. Why doesn’t…margin: 0 auto;
do the trick?

Where there are different width values, (but below) in the same column,
in order to align them , MUST the left margin be manually set for each one?
Also, to omit this is to omit the spacing in-between the div’s


.box {
postion: relative;
border: 3px solid #EEEEEE;
width: 190px;
margin: 0 auto;
overflow: hidden;
padding: 8px 0px 7px 12px;
margin: 5px 0 8px 15px; /*even removing this*/
}
2

by the provided code:


.box {
postion: relative;
border: 3px solid #EEEEEE;
width: 190px;
margin: 0 auto;
overflow: hidden;
padding: 8px 0px 7px 12px;
[B]margin: 5px 0 8px 15px; /*overrides the centering above!!! use margin:5px auto 8px auto; instead*/[/B]
}
3

your second margin is overriding the first margin in .box. the container of .box should have it’s width set as well as text-align:center;

4

thank you