如何将绝对位置对准中心？ [英] How to align the absolute position to center?

问题描述

我在这里看到一个例子：

 < div style =position：relative;> 
< canvas id =layer1width =100height =100
 style =position：absolute; left：0; top：0; z-index：0;> < / canvas> 
< canvas id =layer2width =100height =100
 style =position：absolute; left：0; top：0; z-index：1;> < / canvas> 
< / div> 
  

但我想设置两个画布对齐在屏幕的中心。如果我将left的值设置为常量，而我改变屏幕的方向（因为我在iPad上执行aps），画布不会停留在屏幕中间，如同它在

 < div align =center> 
  

任何人都可以帮忙吗？

解决方案

如果您将左右都设置为零，将左右边距设置为自动，则可以将绝对定位的元素居中。

  position：absolute; 
 left：0; 
 right：0; 
 margin-left：auto; 
 margin-right：auto; 
  

I am trying to stack two canvas together and make it a double layers canvas.

I've saw an example here:

<div style="position: relative;">
 <canvas id="layer1" width="100" height="100" 
   style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>
 <canvas id="layer2" width="100" height="100" 
   style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas>
</div>

But i would like to set both of the canvas align at the center of the screen. If i set the value of 'left' as a constant, while I change the orientation of the screen (as I'm doing aps on iPad) the canvas won't remain at the middle of the screen like how it act in

<div align="center">

Can anyone please help?

解决方案

If you set both left and right to zero, and left and right margins to auto you can center an absolutely positioned element.

position:absolute;
left:0;
right:0;
margin-left:auto;
margin-right:auto;

这篇关于如何将绝对位置对准中心？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！