My background image is not covering the entire page especially as my form got longer towards the bottom and secondly I can’t figure out how to align my radio buttons to the left like I aligned my normal input boxes. I’ll attach screenshots thank you.
font-family: "Poppins", sans-serif;
it would be more helpful if we could see the entire code. do you have a codepen you could link?
Yes here you go and thank you in advance https://codepen.io/ohersi1/pen/ZEXZMPX
use background height to 100vh and background width to 100%
the issue is with your id section which has a position top of 100px
You can check the background-attachment property which have few values such as scroll and fixed. By default, the value of this property is scroll, that’s why you have this. So try to check the other possibilities and you will have what you are searching for.
Thank you so much your solution sorted my problem. Could you also help me with aligning my radio buttons to the left of the container I couldn’t find a solution for that thank you
Your welcome @ohersi1, happy that it worked! About your radio alignement, do you mean you want them in column at the left? Sorry, I am not sure I understood well your question
I need my radio buttons to align left like this hope the screenshot helps thank you
I watched the result you have in your first pictures. You have a CSS definition that makes your radio buttons be centered. Also, label and input are inline block type. According to you, how could you align one radio button and his text on the same line?
You have many possibilities, you could for example created a div or section, between the start of your radio list to his end, and then created div for each label/ input, for that they become blocks. This is only one way, they are many ways, with CSS too with the property display and the value block for example.
Example for the div:
<input type="radio" id="definitely" value="Definitely">
<label for="definitely"> Definitely</label>
After, you just need to check the align from left to right and it will be fine normally
<input type="radio" name="firstradio"> first radio<br>
<input type="radio" name="secondradio"> second radio
you want like this one , if i didn’t guess wrong
<br> which is used for braking something
For the background image try using,
The radio buttons try using.
the display inline css property.