[Solved] Div over canvas [closed]

by


Following way you can put put over canvas using position:absolute;

#header-canvas {
    height: 500px;
    width: 100%;
}

.login-box {
    background: #fff none repeat scroll 0 0;
    left: 50%;
    padding: 20px;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<canvas id="header-canvas" style="background-color:#999"> <header id="header" > </header> </canvas>

<div class="login-box" > <div class="login-box-body">
<form action="" method="post" name="login">
  <div class="form-group has-feedback ">
    <input type="text" class="form-control" placeholder="Username / Email" required name="login_name"/>
    <span class="glyphicon glyphicon-envelope form-control-feedback"></span> 
 </div> 
  <div class="form-group has-feedback"> 
    <input type="password" class="form-control" placeholder="Password" name="login_pass"required/> 
    <span class="glyphicon glyphicon-lock form-control-feedback"></span> 
  </div> 
  <div class="row"> <div class="col-xs-4"> 
    <button type="submit" class="btn btn-primary btn-block btn-flat">Sign In</button> </div> 
</div> 
</form> 
 </div> 
</div>

Working Fiddle

solved Div over canvas [closed]