Help with survey exercise!

HTML-CSS
1

Hi!

You can find my project in the following link:

I have been trying to add some padding, or line height, I am not sure.
In the example that freecodecamp provided, you can see that between the letters, and everything on the right side, there is like more spacing between them:

On the other hand, my survey, everything is like very sticked together, how can I separate them more?

I hope you could understand me what I am trying to say…

My question is, how can I have more spacing between everything? So it looks tidier?

2

I checked our work. It has some issues you need to fix.

You added one disabled option for combobox, but it’s not selected by default. fix it. make that disable option selected.

Next issues is about the radio and checkbox buttons and missed label tags. This is very bad. please fix. each radio and checkbox should come with a dedicated label.

Your layout it not responsive at all.
just check how does it look with mobile, check:

image
image401×875 27.3 KB

I believe you admit it’s not good too.

one reason is becasue textarea. you set cols for textarea to control the width of textarea. please don’t. it’s kind of absolute and would break you page as did.

Another reason is 50% width for #border css rule. Using 50% of screen of a small device(like mobile) is not logical. mobile devices are small enough, so using maximum space of space is kind of gold mining.

I also think, two column grid for mobile with that content survey form has, is not kind of good idea. make it 1 column when it’s in mobile.

Also override and control the text fields(input) to let fit with container(especially for mobile) to avoid layout break.

All I mentioned as issues here dear, all need just some minute for fix, but if you ask me. I suggest you start a completely new survey form from zero and make the layout working first before you persist any page content.

You may check this survey form challenge walkthrough link would help you I believe. It has some code sample, states common issues too you took some of them. Please have read, and start a great survey form, no rush, be patient and do the job great.

keep going on great work. happy programming.

1 Like
3

And about your question.

Assume each div host one element, now having padding for that div will apply some spacing between elements.

Don’t try to mix padding and margin. Use one good layout, which each element comes with good spacing for internal content(padding) and other objects(margin)

Check the link I shared with previous reply, it has some info about padding/margin.

1 Like
4

Thank you for your help, I will study a little more and retry!