Issues with Survey Form. Please help

1

Please help. Im having issues with my html and css. The name and the input box are not on the same line and I dont know how o fix it. Also the submit button doesnt show up. https://codepen.io/Mackdine/pen/gOOOaQK?editors=1100

2

Honestly, save yourself the trouble and make the form a one-column layout with the labels on top of the inputs. It is better UX and easier to make.

  1. You have a typo on .labels, it is inline-block not inlign-block.

  2. .rightTab is a block-level element and will take up the full width of its container so the .label and .rightTab elements will never sit next to each other.

  3. Give the first three .rowTab elements a new class .flex-align-center.

<div class="rowTab flex-align-center">

Add the new CSS for the class and change the CSS for the .label class

.flex-align-center {
  display: flex;
  align-items: center;
}

.labels {
  text-align: right;
  width: 30%;
  padding: 5px;
}

  1. Between lines 62 and 63, you need to close the unordered list </ul>.

  2. On line 82 you need to close the label, you have an opening tag it should be a closing tag.

  3. On line 94 you have a typo for the closing </textarea> tag.

1 Like
3

THANK YOU for your answer.