Odin challenge - signup form using only HTML + CSS - Stuck with positioning...
https://www.theodinproject.com/lessons/node-path-intermediate-html-and-css-sign-up-form
https://codepen.io/Laing91/pen/dyQzYJw
I've been rattling my brain over this for a day and I'm still no further on, so I guess it's time to ask for some help (sad times).
I think I did kinda ok up until the form, then I just got lost. I seem to encounter this issue a lot and preivously I just gave up, so I'm hoping to get this one sorted so I can learn from it finally.
First thing, the form needs to be 2 by 2:
I tried using <br> to do this, and it kinda works in my vscode, but in the codepen it doesn't reflect it obviously. However, I also need to have the text above each box, and I'm not really sure how I do that... I tried <br> again, but it didn't seem to solve it.
Secondly, the background on the form, it needs to be the entire width of the right-container, but I've noticed there's a big chunk of margin/padding from the main-container which is preventing my right-container from spreading to the edge of the page. I tried setting margin and padding to 0 on main but it hasn't changed anything. In the codepen I've removed the main container all-together, but it didn't fix anything.
https://codepen.io/Laing91/pen/dyQzYJw
I've been rattling my brain over this for a day and I'm still no further on, so I guess it's time to ask for some help (sad times).
I think I did kinda ok up until the form, then I just got lost. I seem to encounter this issue a lot and preivously I just gave up, so I'm hoping to get this one sorted so I can learn from it finally.
First thing, the form needs to be 2 by 2:
I tried using <br> to do this, and it kinda works in my vscode, but in the codepen it doesn't reflect it obviously. However, I also need to have the text above each box, and I'm not really sure how I do that... I tried <br> again, but it didn't seem to solve it.
Secondly, the background on the form, it needs to be the entire width of the right-container, but I've noticed there's a big chunk of margin/padding from the main-container which is preventing my right-container from spreading to the edge of the page. I tried setting margin and padding to 0 on main but it hasn't changed anything. In the codepen I've removed the main container all-together, but it didn't fix anything.
The Odin Project empowers aspiring web developers to learn together for free
