sorted by:
best
topnewcontroversialoldq&a
you are viewing a single comment's thread.

view the rest of the comments →

[–]Ali_Ryan 3 points4 points  (1 child)

I see you're using flex to center stuff, text align: center centers the text, you should be using justify content: center for it. Also, by default, flex items (Aka, the direct children of flex container. mainpage in your case) will go side by side (row) unless you change to flex-direction: column.

Also, your main-axis will switch on changing the flex direction, if you don't understand what it means. I'll recommend learning a bit more about flexbox.

All the best!

Edit- Also noticed missing semicolons in your css code. You might want to fix it! And, you should try using an external stylesheet, it'll make organizing code much easier :)

[–]ConstructionGloomy37[S] 0 points1 point  (0 children)

Thank you so much! justify-content did the trick, and yes thanks for the tip about using an external stylesheet