股利出現在中心打破，如果用戶滾動

我有我的頁面的主體/ HTML建立這樣的CSS：股利出現在中心打破，如果用戶滾動

body, html { 
    height: 100%; 
    margin: 0px; 
    padding: 0px; 
    font-family: Segoe, Segoe UI, DejaVu Sans, Trebuchet MS, Verdana, " sans-serif"; 
    font-size: 14px; 
    display: flex; 
    flex-direction: column; 
    background: #282828; 
    min-width: 100%; 
    min-height: 100%; 
}

然後我有一個彈出窗口，我偶爾會追加到頁面（體）使用JQuery。此彈出窗口是DIV如下：

.error_popup_container { 
    width: 400px; 
    height: auto; 
    padding: 10px; 
    background: #454545; 
    border: solid #fafafa 2px; 
    border-radius: 1px; 
    z-index: 3; 
    position: absolute; 
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); 
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); 
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); 
    left: 50%; 
    top: 50%; 
    margin: -50px 0 0 -200px; /* 50px = half of height, 140px = half of width */ 
}

問題是如果用戶尚未滾動，div僅出現在頁面中間。

如果用戶已經滾動div將不在視圖中。

我需要div出現在頁面中間，無論他們滾動多遠。有任何想法嗎？

我玩過一噸，但沒有找到原因。我相信這很簡單。

來源

2017-04-11 Dan James Palmer

請添加您的HTML去與您的風格 – repzero

同意的位置是：固定;並保持它爲中心，我會用：

/*modal-wrapper*/ { 
    position: fixed; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%,-50%); 
}

如果模式都不會長於一個小視窗，你可以用一個溢出-Y添加媒體查詢斷點：滾動;屬性。

來源

2017-04-11 22:34:00

謝謝瑞安，我知道這將是一些痛苦明顯的東西！ –

我想你也許只是想用position: fixed

來源

2017-04-11 21:37:58

股利出現在中心打破，如果用戶滾動

回答

相關問題