Menu
I have a background image and a form I want to center in the browser. I have the image working and I have the form centered vertically, but cannot get it horizontally. I did originally have it horizontally, but not vertically ….see code below: Any help would be appreciated.
[code]
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>
<html>
<head>
<title>Adaptive Methods Login</title>
<style type=”text/css”>
#loginPage {
background-image:url(“login-screen-intranet.jpg”);
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
}
#myoutercontainer {
position:realative;
}
#myinnercontainer {
position:absolute;
top:50%;
height:10em;
margin-top:-5em;
}
label {
color:#FFF;
}
</style>
</head>
<body id=”loginPage”>
<div id=”myoutercontainer”>
<div id=”myinnercontainer”>
<form>
<p><br/><br/><label>Username: </label><input type=”text”/></p>
<p><label>Password: </labbel><input type=”password”/></p>
<p><input type=”button” value=”Login”></p>
</form>
</div>
</div>
</body>