That is my Survey Form project. I know it still needs work and would appreciate some feedback. How do I get the radio, checkboxes, and text boxes to line up together like the project.
It looks like you have line breaks after each control:
<br />
If you want to have radio buttons or checkboxes on the same line, then do not separate with the br tag.
when I do that they end up lining up side by side instead each one on its own line.
I took a look at the original example codepen for the Survey Form. It shows all labels on the left half of the page, and all of the controls (textboxes, radio buttons and checkboxes) on the right half of the page. Is that what you are referring to?
URL of example codepen Survey Form:
If you look at the codepen for the example codepen, and click on the Change View button and choose Editor View, then you will see the html, css and js files. I’m not a CSS wizard, but the classes are defined in just the right way to create this visual appearance. Note the .label class and how it is text-align: right, while the .rightTab class is text-align: left. It looks to me like the controls are using the .rightTab class. I would experiment with these class properties, as well as display: inline-block. Look them up on MDN and see how they behave, and then play with them.
And yes, you are right, you will want to keep the br tags to keep each label and control on their own line.
Sorry been off freeCodeCamp for a couple of days. I will try ur suggestions and appreciate your input.