0

我看过这个问题: Centering a percent-based div

但是我的尝试没有结果。我不太明白那个问题的答案是如何有意义的,或者如何用 100% 的宽度来做。基本上我有一个动态呈现的页面,它有两个 div - 都设置为 100% 宽度和 100% 高度,以便捕获整个输出。因此,如果两个 div 的长度不同,我想将 div 居中到身体:

<body>
  <div id="first">Longer Name</div>
  <div id="second">Name</div>
</body>

电流输出:

OUTPUT LONGER
OUTPUT SHORT

期望的输出:

OUTPUT LONGER
    OUTPUT SHORT

div CSS:

height: 100%;
position: relative;
width: 100%;

正文 CSS:

margin: 0;
padding: 0;

由于输出的动态特性,需要基于百分比的 div。

编辑

我应该明确表示输出是大量的表格。我举的例子是为了展示我希望它如何居中。输出不是文本。基本上一个表格的宽度可能是 120 像素,我需要将它放在正文中(这将是较长 div 的宽度,可能是 1500 像素)。

4

3 回答 3

2
#first, #second { text-align: center; }
于 2012-10-10T19:55:53.960 回答
0

当您使用 % 宽度时,您的网站是灵活的,当您希望所有 div 居中时,您使用此代码,此代码对任何元素内容有用,将在您的任何站点位置居中

#first, #second{    
  width:100%;
  text-align:center;
 }

最好的祝福

于 2012-10-10T20:03:55.683 回答
0

您可以使用这种 css:

#mydiv{
position:fixed;
padding:0px;

z-index: 101;
top:50%;
left:50%;
transform: translate(-50%, -50%); /*what you actually need to center*/

width: 80%;
height: 80%;
background:rgba(0,0,0,1);
display: none;
border:1px solid #d2d2d2;
}
于 2016-02-08T10:31:14.033 回答