자바 스크립트로 양식 생성 및 센터링

Question

양식을 생성하고 센터링하려고합니다.

 var frm = document.createElement("form"); 
     var overlay = document.createElement("div"); 
     var helper= document.createElement("div"); 
     helper.setAttribute("style", "display:inline-block; width:0; heigth:100%; vertical-align: middle; background-color: green;"); 
     overlay.setAttribute("style", "position: absolute; top:0; left:0; right:0; bottom:0; \n\ 
          opacity: 0.8; background-color: black;"); 
     frm.setAttribute("method", "get"); 
     frm.setAttribute("style", "display:inline-block; vertical-align:middle; width:20%; border:2px solid white; padding: 30px; \n\ 
         background-color:#F7F7F7; font-family: \"Arial\", \"sans-serif\"; font-weight: 100;\n\ 
         font-size:12px; opacity: 1;"); 
     document.body.appendChild(overlay); 
     overlay.appendChild(frm); 
     overlay.appendChild(helper); 

이 나는 ​​형태 frm이 사업부 overlay의 HTE의 중심에 위치 할 것으로 예상하고있어 : 난 다음 코드를 작성합니다. 그러나 저는 수직이 아닌 수평 중심 만했습니다. 이 문제를 해결하는 방법?

Answer 1

센터링 :

http://jsfiddle.net/XHFKL/1/

var frm = document.createElement("form"); 
     var overlay = document.createElement("div"); 
     var helper= document.createElement("div"); 
     helper.setAttribute("style", "display:inline-block; width:0; height:100%; vertical-align: middle; background-color: green;"); 
     overlay.setAttribute("style", "position: absolute; top:0; left:0; right:0; bottom:0; \n\ 
opacity: 0.8; background-color: black; text-align:center;"); 
     frm.setAttribute("method", "get"); 
frm.setAttribute("style", "display:inline-block; vertical-align:middle; text-align:center; width:20%; border:2px solid white; padding: 30px; \n\ 
background-color:#F7F7F7; font-family: \"Arial\", \"sans-serif\"; font-weight: 100; margin:0 auto;\n\ 
         font-size:12px; opacity: 1;"); 
     document.body.appendChild(overlay); 
     overlay.appendChild(frm); 
     overlay.appendChild(helper);