在div隐藏时居中是没问题的，父级我采用的是高度不固定的，但是div5的display=block时，父级的高度也会随着增加，这个是都是知道的结果，这个没有通常的向下增加高度而是由中间往上下两个点各增加一点，然后所有子div会向上移动一点，我是想不出现这个现象而是想和通常一样向下增加高度来显示div5。又不影响自适应
html>
<html lang="zh-CN">
<meta charset="utf-8">
<head>
<title>居中问题title>
head>
<style>
#rightMenuNavigation{
border-radius: 18px 0 0 18px;
background-color: #F7F9FA;
position: fixed;
right: 0;
top: 50%;
transform: translateY(-40%);
-moz-box-shadow: -2px 0 30px 2px rgba(97, 105, 119, 0.18);
-webkit-box-shadow: -2px 0 30px 2px rgba(97, 105, 119, 0.18);
box-shadow: -2px 0 30px 2px rgba(97, 105, 119, 0.18);
width: 60px;
z-index: 999;
}
.J_s_tookit_list{
padding: 26px 0;
}
.J_s_tookit_list div{
width: 60px;
height: 46px;
}
style>
<body>
<div id="J_tookit">
<div id="rightMenuNavigation" style="border: 1px solid #f20e00;">
<div class="J_s_tookit_list">
<div id="J_sNews" style="background-color: red;">
111
div>
<div id="J_CustomerServiceBox" style="border:1px solid #3c3c3c;">
222
div>
<div id="J_sfeedbackBox" style="border:1px solid #3c3c3c;">
333
div>
<div id="J_reportBox" style="border:1px solid #3c3c3c;">
444
div>
<div id="J_top_kitBox" style="display:none;border:1px solid #3c3c3c;" >
555
div>
div>
div>
div>
body>
html>
#rightMenuNavigation {
border-radius: 18px 0 0 18px;
background-color: #F7F9FA;
/* 修改 */
position: absolute;
right: 0;
top: 50%;
/* 修改 */
transform: translate(0, -50%);
width: 60px;
z-index: 999;
}
transform: translateY的值为负，也就是说，纵向是从下向上偏移并固定位置，你的高度变化也只会向上挤占空间。