Responsive Web Design Projects - #2 - Survey Project

Hi All,

Looking for some feedback on my second responsive web design project.

Here is the url for it: https://codepen.io/TierneyS/pen/YRZYVW?editors=1100

One thing I had trouble with was the responsive grid and getting the main form grid to consolidate into one column when it gets to be less than 600 px.

There is a secondary smaller grid in there for the “you are willing to bring” selections that seems to work fine, so I am not sure why the main grid isn’t responding.

Is it possibly because of the way I am utilizing the positioning with “grid-area” on things like #basicInformation?

  1. The background image is too distracting. Make it just a solid (light) color and have no opacity on your form. Sometimes, simple is better.

  2. The font itself is too distracting and hard to read.

Check out my html tools below and look for flexbox. It can help you a lot. Also check out the inspiration tab.

Look at some some good examples, and break it down from their. We are so open to ask answer questions you may have (HTML-CSS section).


Notes

Please hit the reply button or I do not get notified.

Helpful tools–> https://codepen.io/Mike-was-here123/post/check-out-these-sites