-1

I am new to css and want to understand some basics. What is the need to set image display property as block to center it inside div ?

#logo {
      display: block;
      margin-left: auto;
      margin-right: auto;
    }

How does changing the display to block change the behaviour of img element inside div (how does it help center image)?

madcolonel10
  • 735
  • 2
  • 9
  • 22
  • 1
    https://stackoverflow.com/questions/24442060/why-centering-with-margin-0-auto-works-with-displayblock-but-does-not-work-with/24442364#24442364 – Alohci Jul 01 '17 at 23:53

1 Answers1

2

img is an inline element so setting it display: block will completely change how it flows on the page

O.Rares
  • 1,031
  • 1
  • 16
  • 19
  • can you explain more how it changes the behaviour inside div on changing from inline to block – madcolonel10 Jul 01 '17 at 18:53
  • 1
    @madcolonel10 Block level elements do not sit inline but break past them. By default (without setting a width) they take up as much horizontal space as they can.So if they take a line you can get the center of it and place your image there – O.Rares Jul 01 '17 at 18:55