如何以正确的方式在 y 轴上对齐 div？ CSS/flex
How do I align my div on the y-axis, proper way? CSS/flex
我正在尝试构建一个登录页面，并且有 3 个 SVG 图像，其中 2 个在顶部，1 个在右下方。它们都是绝对定位的，容器是相对显示的。
现在我基本上想要一个 div 位于外容器顶部的 30/40%。解决这个问题的最佳方法是什么？
1) 制作一个固定高度的 div，但这不是响应式的，我将使用媒体查询。
这是关于图像上显示的蓝色容器，而红色框没有高度，因为它们是抽象的。
enter image description here
有什么想法吗？
这个 div 应该在高度顶部的 30% 上。
什么方法对此最好？
对于垂直对齐，您可以在容器上使用 flex-flow: column;。然后将 flex-basis 设置为弹性项目的百分比。这样就可以控制容器内子元素的相对高度。
参见：jsfiddle
我正在尝试构建一个登录页面，并且有 3 个 SVG 图像，其中 2 个在顶部，1 个在右下方。它们都是绝对定位的，容器是相对显示的。
现在我基本上想要一个 div 位于外容器顶部的 30/40%。解决这个问题的最佳方法是什么？
1) 制作一个固定高度的 div，但这不是响应式的，我将使用媒体查询。
这是关于图像上显示的蓝色容器，而红色框没有高度，因为它们是抽象的。
enter image description here 有什么想法吗？
这个 div 应该在高度顶部的 30% 上。什么方法对此最好？
对于垂直对齐，您可以在容器上使用 flex-flow: column;。然后将 flex-basis 设置为弹性项目的百分比。这样就可以控制容器内子元素的相对高度。
参见：jsfiddle