Getting controls centered on page with background image

Hello,
I thought everything was set nice for my sign on screen. Most users did not experience a line up problem, until one user who has one of those giant monitors brought up the sign on form and things went out of place.
I temporarily fixed it by setting margins. Below is part of the html.  How can I fix so the background image is always centered and the (signon controls..text boxes, button) are always lined up inside the image? 
<body style="margin-top:25px; background-position:center 1%; background-repeat:no-repeat;" background="Images/SignonBackGround.jpg"> <form id="form1" runat="server"> <div align="center" id="Header" style="margin-top: 125px"> </div> <div id="Content" align="center" style="margin-left: auto; margin-right: Auto;"> ...