Question

我昨天发布了这个问题，但是我认为我没有提供足够的信息，所以根据以前的评论重新写了 - 道歉（我是新来的）所以感谢您提供的任何帮助。该网站在修复之前并不真正可用，因此我非常希望将其排序！

（我正在与这个网站上的开发人员合作，因为我的技能有点缺乏。）我们的网站使用的是部分而不是页面。每个部分都应该捕捉到用户的屏幕，然后每个部分的内容应该位于该部分的中心。我们遇到的问题是，目前每个部分的内容都在水平中心，而不是垂直，而是更接近top。显然，这需要基于用户的分辨率来动态。该网站使用HTML5，Javascript和CSS的组合构建;这是目前的结构：

<section id="about1" class="panel overview " data-section-name="about">    
  <div class="aboutsectionbackground"> .................. </div> 
</section>

我们已尝试过如前所述的代码here，但内容更靠近底部，如果我们尝试减少'top'属性，那么对于所有分辨率，它不是垂直的。你能建议解决这个问题吗？

.aboutsectionbackground {
  position: relative !important;
  top: 50%;
  transform: translateY(-50%) !important;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}

正如我所说，非常感谢任何帮助，谢谢：）

Answer 1

尝试绝对位置，根据祖先元素的位置来修复它。

Answer 2

在父div中使用Dim TestPt As Long Dim rows As Long rows = Sheets(1).UsedRange.rows.Count ' Sheets(1).Select Cells.Find(What:="TargetTestPointNumber", After:=ActiveCell, LookIn:=xlFormulas, LookAt:= _ xlPart, SearchOrder:=xlByRows, SearchDirection:=xlNext, MatchCase:=False _ , SearchFormat:=False).Activate TestPt = ActiveCell.Column，在子元素上使用display:table-cell。

Answer 3

这是一种让您的内容始终使用简单的黑客方式在中间垂直显示而无需固定位置/绝对位置等的方法...

你需要的只是一个容器。在此容器中，您放置2 elements (div or section)并为其display: inline-block和vertical-align: middle

其中一个是＆＃34; hack＆＃34; div，高度为100％，另一个只是你的内容。由于它们都具有垂直对齐中间，其中一个是100％高度，另一个将始终垂直对齐到该部分的中间。

看到这个小提琴http://jsfiddle.net/pcgcrmsw/

这样您就不必担心任何内容的高度，这会自动将内容放在中间而不关心内容的尺寸

故障在内容中垂直居中（更新）

3 个答案: