Survey-form text area alignment problem

running the code on local browser giving correct output like firefox ,chrome etc;
but while running on codepen.io alignment of textarea changed.
can anyone tell me solution?
https://codepen.io/Shewalkar/pen/oRWQep

You need to clear the div after the #checkbox div

I would change the HTML to this

<div class="textarea">
  <label>Any Suggestions</label>
  <textarea></textarea>
</div>

You can then add this CSS

.textarea {
  clear: left;
  text-align: center;
}

.textarea > * {
  vertical-align: middle;
}

You may want to look a bit more into how floats and clearing works


But I would suggest not using floats unless you have to practice using them.

Thanks for the help,problem resolved.
But Iā€™m not getting why the output of pencode.io and local browser are different for background color?
can run same code on local browser and on codepen.io check for color scheme on both ?