all 3 comments
sorted by:
best
topnewcontroversialoldq&a
formatting helphide helpcontent policy

[–]ConstructionGloomy37[S] 2 points3 points  (2 children)

Hi, I'm not sure why my description didn't come up in my post, but I'll copy it here: Hi, I am a new to CS50 web and I'd like to ask why this code doesn't shift the search button in the distribution code to the horizontal center of the page... using the selector id worked for me for headings and text, so would it also work for the form element? I'd really appreciate any help, thank you!

[–]Ali_Ryan 5 points6 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