代码之家 › 专栏 › 技术社区 › JaneEyre

垂直对齐在第一页加载时不起作用

translate transform css html

0

JaneEyre · 技术社区 · 8 年前

我试图使用

.element {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

然而,我注意到,在第一页加载时,它并没有很好地工作。div向上移动到页面顶部。刷新时,一切正常,div垂直居中。我能做些什么来解决这个问题?

2 回复 | 直到 8 年前

1

Sylwek 8 年前

display: flex;
align-items: center;

2

0

Alex 8 年前

我倾向于 absolutely 按位置放置元素 50% 然后使用 margin-top:-<half .element height> :

height:100px;
position: absolute;
top:50%;
margin-top:-50px;

推荐文章

wyllyjon · 使用symfony3/twig中的参数进行Html翻译

7 年前

SmartGuyz · 将oneliner键入PHP

8 年前

SmartGuyz · Python到PHP的循环数组

8 年前

Joseph Oliver · 这种语法在Java中的等价物是什么?

8 年前

JaneEyre · 垂直对齐在第一页加载时不起作用

8 年前

Adrian rohit chauhan · 使用CGRectZero初始化UIView的框架

10 年前

Patrick · 在Magento中转换escapeHtml($message)变量

11 年前