Build a Survey Form Resizing Textbox

HTML-CSS
1

Tell us what’s happening:

Newbie just starting out on my first few FCC projects. The problem I’m having is that the textbox isn’t changing size when page is small as well as this spacing I can’t seem to line up

image
image763×646 26.2 KB

Your code so far

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:69.0) Gecko/20100101 Firefox/69.0.

Link to the challenge:

2

Why not set a width on the input elements themselves? You can access them within the CSS quite easily, either by their id, or by a CSS selector.

For example, you could set a rule for

#name, #email, #dropdown {
  /* and in here set a width on the elements. Use a relative value
   *   if you want them to respond to different widths! For testing,
   *   I used vmin, simply because I grok viewport values.
   */
}

As noted in the comment, I’d used vmin when I was testing - read more about that at https://css-tricks.com/simple-little-use-case-vmin/

The argument could be made for either vmin (smaller value of either viewport width or viewport height) or (more logical in this case) vw (viewport width units). I used the vmin to replace a LOT of your margins/padding, and vw to set the actual widths. If you’d like to see the final css for that, drop me a line. after you figure out the answer to your question. lol

3

Thank you! I totally forgot about that in the lesson. I will need to review my notes before I start the next one