I want to set image behind form in HTML and CSS without using bootstrap-CodePudding

I want to set the image behind the form and half part of the image is not shown if I'm using position property is not set properly.., Anyone can help me how to fix it.

I'm adding both screenshots of how it looks now and how I want to set it.

how I want to set this: https://i.stack.imgur.com/b9JHF.png looks like now: https://i.stack.imgur.com/WR9bx.png

CodePudding user response：

You can use position: relative to place your element exactly. Additionally, your below element must have higher z-index than under element

CodePudding user response：

Follow This Example.

<!Doctype Html>  
<Html>     
<Head>      
<Title>     
Add the Background image!   
</Title>  
</Head>  
<Body background="Picture.jpg">  
</Body>  
</Html>