FeedBack For My Project

HTML-CSS
1

I want to use css to beautify my survey form.
Here is the pen link:

https://codepen.io/Afam/full/MRroPm

Please I need suggestions and feedbacks especially as regards aligning the radio and checkboxes properly as well as mobile responsiveness. I don’t want to use Boostrap yet. I want to use pure css for now.

2

Look good I like how you choose it but even if you want to use pure css it will be great if your elements are aligned. Bootstrap is just a tool you can do everything with just CSS. And some elements goes out of the shape pearhaps you can fix it.

3

Thank you Cirediallo for your feeback!
I am completely new to css, though have been doing backend. I understand I need to align some elements properly especially the radio and check buttons and input fields. I am trying to figure the best way to the alignment.

4

pearhaps you can do it this way

<div id="radioButton">
  
    <p>
    Would you recommend AfamAcademyMOOC to a friend?
  </p>
  <div class="theRadio">
    <div>
      <input type="radio" id="Definitely" name="wouldyou" value="definitely" /><label for="Definitely">Definitely</label>
    </div>
    
    <div>
      <input type="radio" id="Maybe" name="wouldyou" value="maybe" /><label for="Maybe">May Be</label>
    </div>
    
    <div>
      <input type="radio" id="Notsure" name="wouldyou" value="notsure" /><label for="Notsure">Not Sure</label>
    </div>
    
  </div>
  
</div>

And the CSS

#radioButton{
  display:flex;
  flex-direction:row;
  vertical-align:center;
}

It is just an example find what you want to do and apply it

5

Thanks alot.
You just reminded me I can actually use flex.
I appreciate!

6

You are welcome and yeah there is a lot of elements that you can use like grid, etc