Inheritance and CSS flexbox

I am trying to build a simple sign up form using HTML, CSS and JS however i am struggling with applying custom styles and positioning to the form elements as its inheriting the styles from the container. For example the form elements should fill the form area and be evenly spaced.

I have tried writing on frontend mentor forum as well. The repo is here including the designs:

I just need some guidance on how to solve the flexbox problem then i will try and add the JS. thanks for any contributions and tips!

I don’t get what you are trying to say, are you trying to achieve something like the first name input?

1 Like

yes. I see you have put an inline style into the HTML. How do you put this into the CSS without it inheriting the style from the container?

You will need to create a CSS selector for the input (or other) elements and use the styling suggested by @mayankverma. There are many ways to do this. Check out our curriculum for how to use selectors.

1 Like

have managed to do that now. Inheritance is always fiddly. Thanks for your input! I just need to keep practising :slight_smile:

1 Like