This forum is now read-only. Please use our new forums! Go to forums
Why won't the margin be auto?
when I set the Display of my Div to Inline-block, my margin stops being auto:
div { width:120px; height:50px; background-color:#bcd2ee; border:2px solid #6495ed; border-radius:10px; text-align:center; display:inline-block; margin:auto; }
can’t inline-bock display and auto margin be used together?
Answer 523e44af548c35e2a6001654
Inline-block and inline set the div next to the preceding element (horizontal placement). Block display sets the div below the element (vertical placement). This is, of course, before applying any CSS to alter the position.
Auto margins set the div horizontally in the center (horizontal placement). So, if you use inline-block and auto margins at the same time, you are trying to place the div horizontally in two different ways that clash with each other.
This is why you can use block display and auto margins together; block is vertical and auto margins are horizontal.
Answer 5578418e937676dc380002c1
For elements with property display: inline-block; “A computed value of ‘auto’ for ‘margin-left’ or ‘margin-right’ becomes a used value of ‘0’. “ PS. by WC3 official specification.
Popular free courses
- Free Course
Learn SQL
In this SQL course, you'll learn how to manage large datasets and analyze real data using the standard data management language.Beginner friendly,4 LessonsLanguage Fluency - Free Course
Learn JavaScript
Learn how to use JavaScript — a powerful and flexible programming language for adding website interactivity.Beginner friendly,11 LessonsLanguage Fluency - Free Course
Learn HTML
Start at the beginning by learning HTML basics — an important foundation for building and editing web pages.Beginner friendly,6 LessonsLanguage Fluency