vngx,
Please re-read my last full paragraph in post #8. [quote=“ronpat, post:8, topic:219374”]
Your presumption that .centerAllContent {text-align:center} should center all content is mistaken.It will center inline and inline-block elements, but not block elements…child1 has been assigned {display:block; width:250px} so it is not affected by {text-align:center} on the parent container. To center .child1, add {margin:0 auto} to .child1, OR change .child1 {display:block} to .child1 {display:inline-block}. The difference will be obvious when you apply those styles. You can also simply delete the width and see how the element displays without the width. With {display:block} assigned, it will extend to the full width of the parent container and the text will be centered because you have assigned {text-align:center} to .child1.
[/quote]
Perhaps I could have written it more like an outline with numbered steps, but the answer to your puzzle is there.