The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Design centering a div within a div margin 0 auto is not working Reply To: centering a div within a div margin 0 auto is not working


only the side of my inner div is on the center of the outer div while the rest is sticking out.

That’s probably due to the huge padding you’ve used to create width/height, in lieu of real text/content. Example: on .center-box you’ve got a combine horizontal padding of 14em, yet the width is set as 4em… that’s really screwing with the alignment. If you reduce the padding to more realistic values, and use real content so that you can see what’s happening, it will be easier to build your quote box.

Also is there any way I can get inner div to go near the top of my outer div without making the outer div position: relative and my inner div position absolute?

Top alignment is the default, but again, those huge paddings, minus any real content, are making it difficult to see. The outer div will expand to the height of the inner div, unless a height/min-height is set, so to create the appearance of top-alignment, you could put a bottom margin on the content, or just increase the bottom padding more than the top on the container.