Question

一直试图将保证金放在内容div周围，但是它不起作用，请帮忙看一下html和css在下面

<?php require_once("include/session.php");?>
<?php require_once("include/functions.php");?>
<?php include("include/mheader.php");?>
<div id="content">
<h3>
    Registration.
</h3>
<p>
Please read the terms and condition before you register
Simply click on register on the home page, and fill in the registration form.
On submission of the registration form, an email will be sent to the registered email on the form, from which you can activate your account
</p>


</div>
<?php include("include/footer.php");?>

css在下面（正在考虑#content {margin：10px 10px 10px 10px;}这应该这样做，但它无法正常工作

body,html {
    margin: 0;
}

#page {
    width: 1060px;
    margin: 0 auto;
    position: relative
    /* is the same as: 
    margin-top: 0;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
 */
}

/* sticky footer */
/*Opera Fix*/
body:before {
    content:"";
    height:100%;
    float:left;
    width:0;
    margin-top:-32767px;
}
#outer:after {
    clear:both;
    display:block;
    height:1%;
    content:" ";
}
/* ...#003399;#383838; */
/*
CSS for Reacheasy site
*/
html, body {
    height:100%;
    margin:0;
    padding:0;
    border:none;
background:#cccccc;
}
#outer {
    width:1060px;
    margin:auto;
    min-height:100%;
    margin-top:-52px;
    border-left:1px solid #cccccc;
    border-right:1px solid #cccccc;
background: white url(backgrounds/nav-bg.jpg) repeat-y left top    
}
* html #outer {
    height:100%
}
/*h1,h3 {
    font-size: xx-large;

    text-shadow: 10px 10px 1px grey;

    color: #000;
    padding: 2em 0 .2em .4em;
    margin: 0;

    background: white url(img/header.jpg) repeat-y right;

}*/
ul#nav {
    height: 2em;
    list-style: none;
    margin: 0;
    padding: .2em 0;
    margin:0;
    background:url(img/tabs.gif);
}
ul#nav li {
    /* 
    background: #48f url(img/tabs.gif);
    */
      display : block;
  background-color : #666666;
     float: left;
    margin: 0 1px 0 0;
    padding-left: 10px;
    border-right: 1px solid #A1A1A1;
}
ul#nav a {
    background: url(img/tabs.gif) 100% 0;
    color: white;
    display: block;
    float: left;
    height: 2em;
    line-height: 2em;
    padding-right: 10px;
    text-decoration: none;
}
ul#nav li.current {
    background-color:#666666 ;
    background-position: 0 -60px;
}
ul#nav li.current a {
    background-position: 100% -60px;
    color: #fff;
    font-weight: bold;
}
#content {
margin:10px 10px 10px 10px;

}

这是标题

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Reacheasy - Foremost website for easy reach of things globally</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<link href="members.css" rel="stylesheet" type="text/css"/>  
</head>
  <body>
<div id="outer">
<div id="page">
<div id="header">
<div id="hlogo">
<span style="float:right;"><img src="img/relogo.jpg"  class="logoImage" width="96" height="96"/></span>
</div>
 <span style="font-size:small;text-shadow: 10px 10px 1px grey;"><h1>Reacheasy<span style="font-size:small;"><?php echo $_SESSION['username'];?></span></h1></span>
  <ul id="nav">
    <li class="current"><a href="index.php">Home</a></li>
     <li><a href="women.php">Women</a></li>
     <li><a href="men.php">Men</a></li>
     <li><a href="children.php">Children</a></li>
     <li><a href="homeandappliances.php">Home&amp;Appliances</a></li>
     <li><a href="visionandsound.php">Vision&amp;Sounds</a></li>
      <li><a href="motoring.php">Motoring</a></li>
      <li><a href="homemore.php">More</a></li>
      <li><a href="howto.php">Help(How to?)</a></li>
  </ul>
</div> <!--end of navigation div -->
</div>

页脚

<div id="footer">


&copy; 2012 Reacheasy
<ul id="footlink">
     <li><a href="contact.php">Contact us</a></li>
     <li><a href="termsandcondition.php">Terms&amp;Condition</a></li>
     <li><a href="faq.php">Faq</a></li>
    </ul>

</div>
</body>
</html>

Answer 1

IMO，这是由未关闭的标签引起的问题。根据您的帖子，您的<div id="outer">未关闭。试着解决这个问题。

我是对的。请参阅this验证结果

第82行，第7列：省略了“div”的结束标记，但OMITTAG NO是   指定的



你可能忽略了关闭一个元素，或者你可能意味着   “自我关闭”一个元素，即以“/＆gt;”结束它而不是“＆gt;”。

更新：您链接的网页上没有ID content的元素，因此在第一个位置存在此元素之前，不会应用保证金规则。

Answer 2

您正在处理collapsing margins。要查看此效果，请在#content。

上应用border:1px solid

试图在内容div周围加上保证金

2 个答案: