Css 动态定心_Css_Layout_Html_Dynamic

Css 动态定心

css layout html dynamic

Css 动态定心,css,layout,html,dynamic,Css,Layout,Html,Dynamic,我去了和，他们都给出了相同的例子。他们说你可以像这样把一个div放在中间，但这不起作用。有人知道为什么吗？我还想知道将div居中的最佳方法。我尝试了margin:0auto；它不起作用 margin: 0; /* reset */ margin-left: auto; margin-right: auto; text-align: center; /* For IE */ 之后的内部零件需要文本对齐：左。必须为div指定定义的宽度，以便边距技巧正常工作： Div中间如果您不知道框的大小，可以

我去了和，他们都给出了相同的例子。他们说你可以像这样把一个div放在中间，但这不起作用。有人知道为什么吗？我还想知道将div居中的最佳方法。我尝试了

margin:0auto

；它不起作用

margin: 0; /* reset */
margin-left: auto;
margin-right: auto;
text-align: center; /* For IE */

之后的内部零件需要

文本对齐：左

。

必须为div指定定义的宽度，以便边距技巧正常工作：

Div中间

如果您不知道框的大小，可以使用允许您仍然使用

边距：0 auto

。（在我链接到的教程中，它们展示了使用

display:inline

和

display:table

完成的事情）

编辑：我的坏消息。他们在演示

display:table

收缩包装时只使用了

margin:0 auto

。

尝试下面的方法

#content
{    
    width: 740px;
    clear: both; 
    padding: 0; 
    margin: 0 auto;
}

您需要IE8及以上版本（我在9上尝试过）。IE抱怨在允许您运行网页之前运行active x控件

<html>
  <head>
    <style>
      #oDiv
      {
        background-color: #CFCFCF;
        position: absolute;
        left:expression(document.body.clientWidth/2-oDiv.offsetWidth/2);
        top:expression(document.body.clientHeight/2-oDiv.offsetHeight/2);
      }
    </style>
  </head>
  <body>
    <div id="oDiv">Example DIV</div>
  </body>
</html>


#奥迪夫
{
背景色：#CFCFCF；
位置：绝对位置；
左：表达式（document.body.clientWidth/2-oDiv.offsetWidth/2）；
顶部：表达式（document.body.clientHeight/2-oDiv.offsetHeight/2）；
}
示例DIV

当然，问题是这与所有浏览器都不兼容。严格使用CSS将div垂直和水平居中更加复杂，但也可以做到。（在正确的位置使用

会有帮助）。

您使用的浏览器是什么？您有任何示例代码吗。可能是gist.github.com或jsfiddle.net

如果我推断出你想要什么，你需要一些东西

包含DIV的DIV

CSS

width

为子DIV定义

CSS

margin:0自动用于子DIV


以下示例代码来自：
HTML
我看到每个人基本上都发布了相同的内容，但他们都在制定规则，规定它必须位于包含分区内（仅供参考，
作为“容器”工作得非常好，它不必是分区），或者必须具有设置的宽度。显然，如果不设置宽度，那么边距将没有效果，因为它将扩展到全宽度（因此没有边距区域）
如果您没有发布您正在使用的实际HTML和CSS，我们真的无法帮助您，因为我们不知道发生了什么。按照标准，margin:0 auto
应该可以正常工作，句号。如上所述，即使未指定宽度，“自动”仍将应用，并且仅当分割扩展到整个宽度时计算为0，因此没有空白可填充
我想到的唯一一件事是删除块级样式。也许您将其定义为display:inline
？内联元素不能有边距，而应注意父元素的文本对齐属性。另外，如果你以任何方式浮动除法，你显然不能说它居中，因为浮动的点是把它推到左边或右边（不是中心）。我们可以继续推测，但实际上你应该改进你的问题。要添加的另一个注意事项是：不能对固定位置元素使用边距：0 auto
。
？这仅仅是因为如果宽度为100%，那么auto将计算为0，因为没有可边缘化的周围空间。这个技巧也适用于百分比，我一直使用75%的宽度。所谓绝对宽度，我的意思是定义的宽度=p“这不适用于所有浏览器”。所以这只适用于IE8+？“那你到底为什么要用这个呢？”阿尼姆森：这就是问题所在。这个问题的标题是动态地以div为中心。提出这个问题的人发布了指向msdn资源的链接，这些链接引用了动态属性。我想，也许他很难从女士那里找到正确的答案。到目前为止，还没有人以任何方式给出正确的答案。问这个问题的人可能想问如何在另一个被阻止的元素中垂直和水平对齐div。他们还链接到Google编码，并且边距：0 auto暗示他是水平居中的，因为OP中从来没有提到过垂直。
<html>
  <head>
    <style>
      #oDiv
      {
        background-color: #CFCFCF;
        position: absolute;
        left:expression(document.body.clientWidth/2-oDiv.offsetWidth/2);
        top:expression(document.body.clientHeight/2-oDiv.offsetHeight/2);
      }
    </style>
  </head>
  <body>
    <div id="oDiv">Example DIV</div>
  </body>
</html>

<div id="parent">
    <!-- Must have a container div -->
    <div id="child">
        This is a test
    </div>
</div>

#parent {
    background-color: green;
    /* Center's text not div. Can be here or in child. */
    /* text-align: center; */
}
#child {
    background-color: red;
    width: 80px; /* Required. Develop your own calculation. */
    margin: 0 auto; /* Centers the div */
}