Display:flex not working for footer

HTML-CSS
1

Here’s my pen https://codepen.io/navdeepio/pen/KLqxOy?editors=1100

the footer isn’t centered, although everything else is…

2

let me see how you did it so that i can help you

3

I think you need to specify a section, footer or something like this in the css.

4

display is used for layout, if you want to center your content you have to use something else like text-align or justify-content.

5

  1. Remember only direct children of the flex container are flex children. You have set the body as a flex container and the only child is the main element.

  2. Next when using flex-direction: column; the properties use for centering switches around. (align-items: center; vs justify-content: center;)

main {
  display: flex;
  flex-direction: column;
  align-items: center;
}
6

try using float to align it to center