相关疑难解决方法(0)

如何使用CSS <div>在另一个内部水平居中<div>？

<div id="outer">
  <div id="inner">Foo foo</div>
</div>

我有一个类似灯箱项目的以下HTML.

<div id="lightbox">
  <img id="image" src="" />
</div>

使用以下CSS:

#lightbox{
display:none;
position:fixed;
width:100%;
text-align:center;
z-index:600;
cursor:pointer;
left:0;
top:100px;
}

#image{
position:relative;
height:600px;
border:1px solid grey;
}

为了使图像始终在水平中心,我只是在包装div上使用text-align:center,所以我100%确定它是正确的.

我遇到了垂直居中的问题,我使用的方法是简单地设置#lightbox属性中的顶部值.

正如您所看到的,图像的高度是已知的,因此在jQuery中很容易实现,但我正在寻找一个纯CSS解决方案.

有任何想法吗？谢谢.

是否可以在%高度div中垂直居中？

我已经在任何地方搜索过,无法找到答案.

如何在砌体布局中垂直和水平居中div？我基本上想要围绕这个div构建一切.

任何帮助都会很棒!

http://isotope.metafizzy.co/