Layout 在容器内对中多个浮动div_Layout_Html_Css Float_Centering

Layout 在容器内对中多个浮动div

layout html

Layout 在容器内对中多个浮动div,layout,html,css-float,centering,Layout,Html,Css Float,Centering,好的，这里有一个链接到我正在工作的网站我目前将消息放在自己的div（#messagebox）中，图片放在自己的div（#picture）中。这两个div都向左浮动。我把它们放在一个名为“intro#u container”的容器div中。我想把这个包含div的文件放在中间，但是我遇到了问题。我曾尝试将边距设置为0和自动，但没有成功。这一定是我试图处理的不同级别div数量的某种问题任何帮助都将不胜感激在#intro_容器上设置宽度，否则边距：0自动无效。要使0自动工作，必须指定宽度您可以将

好的，这里有一个链接到我正在工作的网站

我目前将消息放在自己的div（#messagebox）中，图片放在自己的div（#picture）中。这两个div都向左浮动。我把它们放在一个名为“intro#u container”的容器div中。我想把这个包含div的文件放在中间，但是我遇到了问题。我曾尝试将边距设置为0和自动，但没有成功。这一定是我试图处理的不同级别div数量的某种问题

任何帮助都将不胜感激

在

#intro_容器上设置宽度，否则边距：0自动无效。
要使0自动工作，必须指定宽度
您可以将所有内容放在一个容器div中，比如宽度900px margin 0 auto，或者您可以简单地将这些样式应用于intro容器
现在，css正在将所有内容缩放到视口宽度，因此float left将图片发送到intro_容器的宽度，该容器没有定义宽度
另外请注意，您可以将您的id直接应用于图像！无需将其包装在div中。按语义对元素进行样式设置是一种很好的做法。
有时，最好将以下内容集中：
<html>
<head>
</head>
<body>
<div style="position:relative;width:400px;height:400px;background-color:green">

  <div style="position:absolute;margin-left:50%; left: -100px; width:200px;height:200px; background-color:red">
here attribute 'left' is half of this container width
  </div>
</div>
</body>
</html>


此处属性“left”是此容器宽度的一半

始终工作
啊，我认为这可能是问题所在……因此我必须计算一个宽度，至少是其中2个div的宽度，然后我应该能够设置边距：0 auto；？是的，如果它比两个div的宽度短，则浮动div将堆叠在彼此的顶部。如果它更大，它就会偏离中心。一定要考虑到任何边距或填充，因为这会增加宽度。