
- CSS Tutorial
- CSS - Home
- CSS - Introduction
- CSS - Syntax
- CSS - Inclusion
- CSS - Measurement Units
- CSS - Colors
- CSS - Backgrounds
- CSS - Fonts
- CSS - Text
- CSS - Images
- CSS - Links
- CSS - Tables
- CSS - Borders
- CSS - Margins
- CSS - Lists
- CSS - Padding
- CSS - Cursors
- CSS - Outlines
- CSS - Dimension
- CSS - Scrollbars
- CSS Advanced
- CSS - Visibility
- CSS - Positioning
- CSS - Layers
- CSS - Pseudo Classes
- CSS - Pseudo Elements
- CSS - @ Rules
- CSS - Text Effects
- CSS - Media Types
- CSS - Paged Media
- CSS - Aural Media
- CSS - Printing
- CSS - Layouts
- CSS - Validations
- CSS3 Tutorial
- CSS3 - Tutorial
- CSS3 - Rounded Corner
- CSS3 - Border Images
- CSS3 - Multi Background
- CSS3 - Color
- CSS3 - Gradients
- CSS3 - Shadow
- CSS3 - Text
- CSS3 - Web font
- CSS3 - 2d transform
- CSS3 - 3d transform
- CSS3 - Animation
- CSS3 - Multi columns
- CSS3 - User Interface
- CSS3 - Box Sizing
- CSS Responsive
- CSS - Responsive Web Design
- CSS References
- CSS - Questions and Answers
- CSS - Quick Guide
- CSS - References
- CSS - Color References
- CSS - Web browser References
- CSS - Web safe fonts
- CSS - Units
- CSS - Animation
- CSS Resources
- CSS - Useful Resources
- CSS - Discussion
Role of margin property with value auto using CSS
The margin property with value auto is used to horizontally center the element within its container. You can try to run the following code to implement margin: auto;
Example
<!DOCTYPE html> <html> <head> <style> div { width: 200px; margin: auto; border: 2px dashed blue; } </style> </head> <body> <p>This is demo text</p> <div> This is horizontally centered because it has margin: auto; </div> </body> </html>
Output
- Related Articles
- Role of margin property with value inherit using CSS
- How does auto property work in margin: 0 auto in CSS?
- Usage of margin property with CSS
- Usage of margin-top property with CSS
- Usage of margin-bottom property with CSS
- Usage of margin-right property with CSS
- Animate CSS margin property
- Center alignment using the margin property in CSS
- Role of CSS flex-wrap property wrap value
- Role of CSS flex-direction property column value
- Role of CSS flex-direction property row value
- Role of CSS justify-content property center value
- Animate CSS margin-bottom property
- Animate CSS margin-left property
- Role of CSS flex-wrap property wrap-reverse value

Advertisements