https://codepen.io/md9453201/pen/JjoOxvL Using flex box I can move the body of my form onto the background image, but the header doesn’t move with it. I need to unify the header and the body of the form but nothing I’ve tried has worked. Hints?
-
<body>
should be around<main>
- add this to
#main
in your CSS:
display: flex;
flex-direction: column;
align-items: center;
Thank you. That did it. “Column” and “row” make me feel dyslexic. It just seems backwards [to me].
But thank you very much. I have been banging against this all day.
PS What do mean by “body” should be around “main”?
The body element should contain the main element.
<!DOCTYPE html>
<html lang="en">
<head></head>
<body>
<main>
...rest of html
</main>
</body>
</html>
On Codepen you don’t actually need the <html>
and <body>
elements.