1

上下のマージンだけを使用して、div を垂直方向に中央に配置する必要があります。

ということで、JavaScriptで余白を生成するようにしました。

var xLength = ((document.getElementById("outerdiv").offsetHeight)+"px");

xLength = (xLength - 222); //222 is the Length of the to be centered div

xMargin = (xLength / 2); //because of the 2 margins
xMargin = (xMargin());

document.getElementById(innerdiv).style.marginTop = xMargin;
document.getElementById(innerdiv).style.marginBottom = xMargin;

助けてください、それを機能させることができません、何かアイデアはありますか?

外部 div と内部 div の CSS は次のとおりです。

#outerdiv {   
    min-height:302px;
    width:58px;
    margin-left:640px;
    z-index:2;
    float:right;
    margin-right:228px;
    border: 1px solid black;
    position:absolute;
}

#innerdiv {
    height:222px;
    width:58px;
    position:absolute;
    border: 1px solid green;
}

HTML:

<div id='outerdiv'>
  <div id='innerdiv'>
  </div>
</div>
4

2 に答える 2

3

これは、要素の親自体に定義された高さがないためです。

JavaScriptに関して、1つの問題はこの行です。これはまったく意味がないため、削除する必要があります。

xMargin = (xMargin());

また、設定する値に「px」を追加し、次のようにIDを引用符で囲む必要があります。

document.getElementById('innerdiv').style.marginTop = xMargin + 'px';
document.getElementById('innerdiv').style.marginBottom = xMargin + 'px';
于 2011-08-17T10:44:14.750 に答える
2 
window.onload = checkAvailableHeight;

window.onresize = checkAvailableHeight;

function checkAvailableHeight(){
    var yourDiv = document.getElementById("yourDiv");
    yourDiv.style.marginTop = ((window.innerHeight - yourDivHeight) / 2) + "px";
}
于 2012-02-16T22:09:32.270 に答える