Unable to set Width property on Form

Question

It seems i cant set the width property of my Email input form (Via picture). For some reason width:100%; on the parent or child element does not work as intended. I need the form input to be as wide as all the other elements on my personal page

Here you can see the code: https://codepen.io/wodosharlatan/pen/ExpbVwg?editors=1100

Any help is appreciated and thanks for your time

Answer 1

It's due to your display: grid; setting on the parent. This means the form will have the same width as the widest element in its column. In this case the contact__information div.

The solution is to add the following to your css:

.contact__form {
   grid-column:  span 2;
}

This will stretch your form over the width of the two columns.