Survey form about travels

Hi everybody. Can you please tell me what you think about my survey form project?
:slight_smile: thank you in advance!
https://codepen.io/eleonoralbasi/pen/OrXRom

2 Likes

Looks great! Very clean, and easy to understand. One thing, though – and not a negative, simply another way to tackle the same problem:

The form element can function as a block-level element, and you’ve set it up with a two-column format, using two classes: first-column and right-column. And that works. But something similar could have been done without needing to create custom classes for the purpose: a CSS grid layout. If you had defined the form like this:

form#survey-form {
  display: grid;
  grid-template-rows: 50% 50%;
  ...
}

Then, any block elements within the form would be placed left-right-left-right in a two-column layout, without needing classes.

To read more about using CSS grid layouts, take a look at https://css-tricks.com/snippets/css/complete-guide-grid/

2 Likes

Looking great!
If you’re looking for feedback, here are my 2 cents:
-Make it so the form displays correctly in small screens: maybe add a media queria for max-size ~600px
-This one is just personal taste hehe. The submit button looks rather “defaulty”, maybe remove that border or add a new one to go with your style?

Keep it up!

Thank you very much for your feedback!
I changed the design of the button to get it closer to my style, and make the page more responsive.
I am still trying to understand better the media queries… :sweat:

Hey that’s way better! The button’s color made all the difference! And the form looks awesome in my phone’s screen now. Thanks for sharing

1 Like

It looks good for the most part, but there is a little bit of overlap when the screen is shrunk down to around 680 px. You might consider another media query.

Please take a look at my product page

It looks clean and nice :slight_smile: I liked the background color used.

1 Like

Looks great to me, I couldn’t reach such a level yet. The design is simple and stylish at the same time, I like it. I love to wonder travel sites to seek an inspiration to create a similar project, but my skills are not enough yet.

1 Like