How Do I Horizontally Center a Div in CSS?

Centering a Div Horizontally in CSS

Question:

How do I center a

horizontally?

Problem:

Setting text-align: center; on the

does not center it horizontally.

Answer:

Horizontal Centering for Block Elements

• text-align: center; only centers the element's inline contents, not the element itself.

• For block elements (like

  ), use:

  • margin: 0 auto;

  This sets top and bottom margins to 0 and left and right margins to auto of the same size. The element will be centered automatically, given that it has a known width.

  Horizontal Centering for Inline Elements

  • Set text-align: center; on the parent element instead.

The above is the detailed content of How Do I Horizontally Center a Div in CSS?. For more information, please follow other related articles on the PHP Chinese website!