Html 为什么浮子会把div上面的事情搞得一团糟？_Html_Css

Html 为什么浮子会把div上面的事情搞得一团糟？

html css

Html 为什么浮子会把div上面的事情搞得一团糟？,html,css,Html,Css,我有完美的工作代码，但它不能按我希望的方式工作。。。但这是有效的我想要居中而不是浮动以下是工作代码： My.css： *{ 保证金：0；填充：0； } 正文{背景：#ededed url（../images/bg.gif）repeat-x；} p{ 颜色：#999；填充：0；利润率：10px0；字体：12px/18px Arial，Helvetica，无衬线； } #容器{ 保证金：自动；宽度：950px； } #标题{ 高度：302px；c 宽度：950px；浮动：左；背景：

我有完美的工作代码，但它不能按我希望的方式工作。。。但这是有效的

我想要居中而不是浮动

以下是工作代码：

My.css：

*{
保证金：0；
填充：0；
}
正文{背景：#ededed url（../images/bg.gif）repeat-x；}
p{
颜色：#999；
填充：0；
利润率：10px0；
字体：12px/18px Arial，Helvetica，无衬线；
}
#容器{
保证金：自动；
宽度：950px；
}
#标题{
高度：302px；c
宽度：950px；
浮动：左；
背景：url（../images/header.gif）不重复；
}
#徽标{页边距顶部：60px；}
#标志h1{
显示：块；
浮动：左；
宽度：503px；
高度：57px；
文本缩进：-9999px；
}
#标志H1A{
显示：块；
宽度：100%；
身高：100%；
大纲：无；
背景：url（../images/logo.png）不重复0；
}
#航行{
高度：38px；
宽度：950px；
边缘顶部：152px；
浮动：左；
}
.nav链接李{
显示：内联；
填充：3px25px0；
浮动：左；
}
.nav链接李a{
文本转换：大写；
颜色：#fff；
文字装饰：无；
字母间距：-1px；
字体：粗体14px Arial，Helvetica，无衬线；
}
.nav链接li a:hover{color:#ff0；}
.电话号码李{
浮动：对；
列表样式类型：无；
文本转换：大写；
颜色：#fff；
字母间距：-1px；
垫面：3件；
字体：标准14px Arial，Helvetica，无衬线；
}
氢{
文本转换：大写；
颜色：#666；
字母间距：-1px；
填充顶部：7px；
字体：粗体16px Arial，Helvetica，无衬线；
}
.content中间p{text align:justify；}
#资源中心{
浮动：对；
宽度：322px；
边缘顶部：20px；
}
.登录顶部{
浮动：左；
高度：32px；
宽度：292px；
背景：url（../images/sidebar_top.png）不重复；
填充：4px15px；
}
.登录中间{
浮动：左；
宽度：290px；
填充：5px15px 0 15px；
右边框：1px实心#D3；
左边框：1px实心#d3；
背景：#fff；
}
.login中间p{text align:justify；}
.登录底部{
浮动：左；
高度：16px；
宽度：322px；
边缘底部：15px；
背景：url（../images/sidebar_bottom.png）不重复；
}
#页脚{
明确：两者皆有；
高度：111px；
背景：url（../images/footer.gif）重复-x底部；
}
#页脚内容{
高度：91px；
宽度：950px；
填充顶部：20px；
保证金：自动；
}
#页脚内容{
颜色：#fff；
文本对齐：居中；
填充顶部：35px；
}
.div按钮{文本对齐：居中；
}
.login{宽度：25%；}
.按钮{
背景：-webkit渐变（线性、左上、左下、颜色停止（0.05，#89c403）、颜色停止（1，#77a809））；
背景：-莫兹线性梯度（中心顶部，#89c403 5%，#77a809 100%）；
过滤器：progid:DXImageTransform.Microsoft.gradient（startColorstr='#89c403'，endColorstr='#77a809'）；
背景色：#89c403；
-moz边界半径：9px；
-webkit边界半径：9px；
边界半径：9px；
边框：1px实心#74b807；
显示：内联块；
颜色：#ffffff；
字体系列：Verdana；
字体大小：14px；
字体大小：粗体；
填充：6px 30px；
文字装饰：无；
文本阴影：0px 1px 0px#528009；
}.按钮：悬停{
背景：-webkit渐变（线性、左上、左下、颜色停止（0.05，#77a809）、颜色停止（1，#89c403））；
背景：-莫兹线性梯度（中心顶部，#77a809 5%，#89c403 100%）；
过滤器：progid:DXImageTransform.Microsoft.gradient（startColorstr='#77a809'，endColorstr='#89c403'）；
背景色：#77a809；
}.按钮：激活{
位置：相对位置；
顶部：1px；}

我的Html：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="icon" type="image/x-icon" href="images/favicon.ico" />
<title>Pachonk - Home</title>
<base href="http://alex.piechowski.org/school/"></base>
<link href="css/admin.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="js/noty/jquery.noty.js"></script>
<script type="text/javascript" src="js/noty/layouts/top.js"></script>
<script type="text/javascript" src="js/noty/layouts/inline.js"></script>
<script type="text/javascript" src="js/noty/themes/default.js"></script>
<script type="text/javascript" src="js/script.js"></script>
</head>
<body>
<div id="container">
  <div id="header">
    <div id="logo">
      <h1><a href="home">Pachonk - Your Assignments, anywhere!</a></h1>
    </div>
    <div id="navigation">
      <ul class="nav-links">
        <li><a href="home">home</a></li>
        <li><a href="#">our schools</a></li>
        <li><a href="#">applications</a></li>
        <li><a href="#">about us</a></li>
        <li><a href="contact">contact us</a></li>
      </ul>
      <ul class="phone-number">
        <li>free quotation - 0800 123 456</li>
      </ul>
    </div>
  </div>
  <div id="content-center">
  <div class="login-top">
  <h2>Administrator Login:</h2>
  </div>
    <div class="login-middle">
        <p>> Email confirmation upon register theming</p>
        <p>> Dynamic nav bar</p>
        <p>> Contact me form active</p>
        <p>> Make logout.php a json response</p>
        <p>> Error checking both server side and client side registration</p>
        <p>> Log in using email OR username</p>
        <p>> login box display more detials</p>
        <p>> Password reset</p>
        <p>> include files to memory save</p>
        <p>> inline noty's on login/register.</p>
        <p>> clean code</p>
        <p>> admin side</p>
        <p>> library for logcheck/admin check</p>
    </div>
    <div class="login-bottom">
    </div>
  </div>
  </div>
 <div id="footer">
  <div id="footer-content">
<p>&copy; Copyright
2013
 Pachonk</p> 
  </div>
</div>
</body>
</html>

但是它把上面的div搞乱了。

添加以下内容：

#content_center {
    margin-left: auto ;
    margin-right: auto ;
    width: 322px;
    margin-top: 20px;
    clear: both;
}

左侧或右侧均不允许有浮动元件（由于

清除：两者均）。
您需要删除：
margin-top: 20px;

来自资源中心，因为这将推动该部门的一切
编辑：上面的答案告诉你添加
clear:both; 

这也行得通，我猜我误解了你的问题，以及为什么你首先需要边际利润。我仍然完全不知道为什么你首先需要利润率最高，如果有人不介意解释的话，我真的很烦
 演示：工作正常，完美无瑕。你能编辑一下它为什么有效吗？这样我就可以奖励你你的“接受答案”？它有效是因为属性清晰：左侧或右侧都不允许浮动元素谢谢，想编辑一下并说出来吗？7分钟后，如果允许的话，我会接受的。