# Beta Survey Form. Feedback appreciated **URL:** \ **Category:** I Built This\ **Created:** [February 12, 2018, 7:53pm UTC](https://forum.freecodecamp.org/t/beta-survey-form-feedback-appreciated/174244 "2018-02-12T19:53:00Z")\ **Posts on this page:** 4\ **Page:** 1
**Author:** ![Alemrv](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/alemrv/32/77128_2.png) [@Alemrv](https://forum.freecodecamp.org/u/Alemrv)\ **Post date:** [February 12, 2018, 7:53pm UTC](https://forum.freecodecamp.org/t/beta-survey-form-feedback-appreciated/174244/1 "2018-02-12T19:53:00Z")
i don’t know how it works, but it kinda does. feedback appreciated > **[Survey Form](https://codepen.io/alemrv/full/wyzzOq)** > > freecodecamp survey project... ---
**Author:** ![yoizfefisch](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/yoizfefisch/32/65794_2.png) [@yoizfefisch](https://forum.freecodecamp.org/u/yoizfefisch)\ **Post date:** [February 14, 2018, 11:13am UTC](https://forum.freecodecamp.org/t/beta-survey-form-feedback-appreciated/174244/2 "2018-02-14T11:13:48Z")
@Alemrv, Beautiful responsive form! I like the combination of colors, icons and the font. Excellent use of `flex`! It passes the HTML and CSS validators. A few things to consider: 1. **Radio and Checkbox labels:** For accessibility reasons, all your form elements including radio buttons and checkboxes should have their own labels. Adding a label to these elements also enables the user to click on the text instead of having to click directly in the radio button or checkbox. I see that you created labels for the **group** of radio buttons and checkboxes but this is invalid, to do that you will have to use the `
` and `` elements. 2. **Units of 0:** Consider changing 0px to just 0 as suggested by CSS Lint and other sources (it shows up once in your CSS). 3. **Background shorthand property:** The `background` property that you used is a shorthand property that can also set the `background-position`, `background-size`, `background-repeat` & `background-attachment` properties and semms to be the generally recommended way to do it. 4. **Default select:** You can add the property `selected` to the ‘Select an option’ `option` in the dropdown, this will make it the default which was probably intended. Also, the `value` property on this option was left blank. ---
**Author:** ![camper](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/camper/32/67027_2.png) [@camper](https://forum.freecodecamp.org/u/camper)\ **Post date:** [February 16, 2018, 3:10am UTC](https://forum.freecodecamp.org/t/beta-survey-form-feedback-appreciated/174244/3 "2018-02-16T03:10:33Z")
@Alemrv Great design! I agree with all of @yoizfefisch’s comments. I’d like to add a couple of other things I noticed: - **CSS ID Selectors** : Even though some may disagree, a common CSS opinion is to avoid using ID selectors whenever possible. The [ID Selectors section of Interneting is Hard](https://internetingishard.com/html-and-css/css-selectors/#id-selectors) has a short and simple explanation of one of the reasons: - **Nesting CSS Selectors** : There are a couple of CSS selectors that are possibly more specific than they need to be, `#email-label > i` and `#number-label > i`. These types of child selectors may lead to problems when using this code in the future. Since our projects are relatively basic at this stage, I think it’s a good idea to develop good habits early on. The [cssguidelin.es section on specificity](https://cssguidelin.es/#specificity) does a good job of explaining all of the issues regarding CSS specificity and why one wants to keep specificity as low as possible. Well done! ☀ ---
**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\ **Post date:** [June 1, 2021, 1:55pm UTC](https://forum.freecodecamp.org/t/beta-survey-form-feedback-appreciated/174244/4 "2021-06-01T13:55:45Z")