在div的中间垂直对齐左div

时间:2015-08-30 11:06:21

标签: html css alignment

我在另一个(右)div的左侧做了一个带有div的“箭头”。两者都在容器div中。我试图将它对齐在父级的中间(因此保持在右侧div的中间对齐)

top: 50%;

......但它并没有准确对齐中间。它可以设置为“margin-top”,但我不想要固定值。

这是JSFiddle:http://jsfiddle.net/qhofmgbb/

1 个答案:

答案 0 :(得分:1)

top: calc(50% - 4px)

4px是箭头div对角线的一半,除以2。 sqrt(6 * 2 + 6 * 2)/ 2。

说明:旋转箭头div,对角线长度为8.48像素。 您应该在容器的div高度的中间减去该值的一半,以找到相对于顶部的y坐标,以使其居中。 但这在旧版浏览器中不起作用。