Hi,
I went through a lot trying to get the grid looking right on this project. Any feedback is welcome. Thank you.
Hi,
I went through a lot trying to get the grid looking right on this project. Any feedback is welcome. Thank you.
Maybe have this be the default for the container before the grid kicks in.
.container {
display: flex;
flex-direction: column;
justify-content: center;
max-width: 420px;
margin: 0 auto;
}
I would give the grid align-items: center;
Give the inputs some padding.
Use cursor: pointer; on the #submit button.
Anyway, nice job.
Nice page, though I never want you to order a pizza for me.
Couple of things to revisit;
@Roma You are right, for some reason I thought there was a test for that. I guess not.
@lituohuang You should add the for
attribute to your labels with the value equal to the input id
<div id="name1" class="leftcol">
<label for="name" id="name-label" class="rightcol">Name
</div>
<input type="text" id="name" placeholder="First Last" required>
</label>
@lasjorg @Roma Thank you both for taking the time to give me feedback; I will incorporate the suggestions and reply with the updated link.
Oh my GOSH! this survey form drives me bananas!!!
so much that I am going to shout “GREAT JOB!!”
I really wonder what banana pizza tastes like. tell me when you try it!
@ConnerOw1115 Hahaha thank you. I have no idea what banana pizza tastes like and I don’t plan on finding out.
Yeah! me too.
tries banana pizza
feeds it to pet mokey
@Roma @lasjorg I have made all the changes here: https://codepen.io/lituohuang/pen/oOKYXq
Thanks again for your feedback!
Good job! Looks good
Looks good. One thing I like to do is set the resize property on textarea to vertical only. That way the user can only make the box taller and not wider (so it doesn’t overflow the form).
textarea {
resize: vertical;
}