Survey Form complete

Code Feedback
1

My survey

Perhaps not the most inspiring survey page of all time, and actually extremely difficult to come up with something fun.

Finally finished my survey page. Would love any comments/advice.

A few questions from this challenge:

  1. If I want to line up my checkboxes with the images how is this done?
  2. If I have a class of:
  • class=“box … redbox”
  • class=“box … bluebox”
  • class=“box … greenbox”

And I want to select all .box.redbox & .box.greenbox together how can I do this with CSS?

i.e .box.redbox.greenbox {}

Thank you.

p.s I’ve used a lot of as I want to get used to splitting up my work,

1 Like
2

Hey @oocopperpot!
Your form looks and simple. I have one change.

  • You can add text at the footer like "Made by oocopperpot " .

That’s Feedback.

Thanks and Happy Coding :grin:

1 Like
3

Your form looks good @oocopperpot. Some things to revisit;

  • Change the cursor to a pointer when hovering over the submit button
  • Do not use the <br> element to force line breaks or spacing. That’s what CSS is for.

Get familiar with the box methodology. Once you realize everything you see on a webpage is just a box you need to move around and resize, things will start to click. Try adding the following at the start of your CSS to better see how you have elements set;

* {
  border: solid 1px red;
}

Correct usage would be class="box redbox" and class="box bluebox" et cetera. So to style all the boxes the same you’d use the selector .box and style them. It you want to do some additional styling to just the two then you’d use the selector redbox, greenbox for your declaration block.

https://devdocs.io/html/element/br

1 Like
4

Brilliant, thank you! :slight_smile:

I’ll add the footer.

5

Thanks Roma, you’ve given some good reading material for tomorrow!

And the CSS border tip will come in handy, gonna add that from now on. :smiley:

6

Hey Roma,

I’m using the border to select all elements, pretty cool! So much easier to see what’s what. However I’m struggling to single out the individual logos next to the checkbox. Is this because the label associates the image with the checkbox and thus moves everything as one?

I’ve got my list of selectors up but not sure which one I need to single out the img without moving the checkbox.