HTML为什么页边空白顶部不起作用？_Html_Css

HTML为什么页边空白顶部不起作用？

html css

HTML为什么页边空白顶部不起作用？,html,css,Html,Css,你好，我有一个使用css、html和php的网页。请看一下这个代码： <?php session_start(); include_once "mysql_connect.php"; $log = null; if(isset($_SESSION["ID"])){ $log = $_SESSION["ID"]; }else{ $log=null; } $_SESSION["prevpage"] =

你好，我有一个使用css、html和php的网页。请看一下这个代码：

    <?php
    session_start();

    include_once "mysql_connect.php";
     $log = null;
    if(isset($_SESSION["ID"])){
     $log = $_SESSION["ID"];
    }else{
     $log=null;
    }
      $_SESSION["prevpage"] = "home";
      $terms = $_POST["search"];
      if($terms == null){
            header("location:home");
      }
    ?>
   <html>
   <head>
     <title><?php echo $terms;?></title>

    <link rel="icon" type="image/png" href="favicon-32x32.png" sizes="32x32" />


     <link rel="stylesheet" href="css/reset.css">
     <link rel="stylesheet" href="css/text.css">
     <link rel="stylesheet" href="css/960_24_col.css">
     <link rel="stylesheet" href="css/style.css">
     <META NAME="ROBOTS" CONTENT="INDEX, FOLLOW">
     <meta name="description" CONTENT="Find everything and anything on Omicrome">
     <META NAME="ROBOTS" CONTENT="INDEX, FOLLOW">
     </head>
          <body>
            <div class = "container_24">
            <header>
            <div id = "rectban">
            <h1>Omicrome</h1>
            <nav>
            <ul>
            <li><a href="home">Home</a></li>
            <li><a href="articles">Articles</a></li>
            <li><a href="about">About</a></li>
            <?php if($log != null){?>
            <li id = "myprofilebanner"><a href="MyProfile">My Profile</a></li>
            <?php }else{ ?>
            <li id = "myprofilebanner"><a href="createAccount">Create Account</a>        </li>
            <?php } ?>


            <li id = "loginbanner"><a href= <?php if($log != null){?>"logout.php"<?php }else{?>"login"<?php  }?>><?php if($log != null){?>Log Out<?php  }else{?>Log In <?php  }?></a></li>

          </ul>
          </nav>
         </div>
          <div id = "Postban">
           <form action="searchresults.php" method="post" enctype="multipart/form-data">
             <input class="searchbar"  type="text" name="search" size="30" maxlength = "500" placeholder="Search"/>
             <input type="submit" class = "searchbtn" value="[&nbsp;&nbsp;Go&nbsp;&nbsp;]" />
           <a class="Post" href="post" >
           [&nbsp;&nbsp;Post&nbsp;&nbsp;] 
            </a>
           </form>    
        </div>            
     </header>





       <div class = "main clearfix">
       <div id = "rectsearchresults">

        <?php 


                $fetchlast = mysql_query("SELECT * FROM posts WHERE id=(SELECT MAX(id) FROM posts)");
                $lastrow = mysql_fetch_row($fetchlast);
                $lastid = $lastrow[6];

                for ($i=1; $i <= $lastid; $i++) { 

                    $currentname = mysql_query("SELECT * FROM posts WHERE id=$i");

                    while ($row = mysql_fetch_array($currentname)) {
                        $title = $row[0];
                        $desc = $row[1];
                        $ID = $row[6];

                        $title2 = rtrim($title);
                        $donetitle = str_replace(" ", "-", $title2);
                        $url = "articles/".$ID."/".$donetitle."";

                        echo "<div id=\"result\"><img src=\"img/tempsmall.png\" alt = \"icon\" > 
                                <a id=\"resultheader\" href=\"$url\">$title</a><br>
                              </div>";

                    }

                }
        ?>

    </div>
    </div>







    </div>
    </div>

    </body>

    </html>

这是我得到的结果，我希望每个结果的标题与图像顶部对齐

（锚定标记）默认情况下为显示：内联和
“内联”类型元素不接受负页边距顶部
有许多解决方案：
1） 使用显示：表格
。它具有内联块的内容拟合特性，但也支持负边距
#resultheader {
    margin-left: 60px; //adjust to your likes
    color: black;
    font-size: 15px;
    margin-top: -30px; //adjust to your likes
    display: table;
}

2） 使用垂直对齐
属性
#resultheader {
    margin-left: 10px;
    color: black;
    font-size: 15px;
    vertical-align: 10px; //adjust
}

3） 使用position:relative
和top
属性
#resultheader{
    margin-left:10px;
    color:black;
    font-size: 15px;
    position: relative;
    top: -6px;
}

选择您的选项。
（锚定标记）在默认情况下是显示：内联的和
“内联”类型元素不接受负页边距顶部
有许多解决方案：
1） 使用显示：表格
。它具有内联块的内容拟合特性，但也支持负边距
#resultheader {
    margin-left: 60px; //adjust to your likes
    color: black;
    font-size: 15px;
    margin-top: -30px; //adjust to your likes
    display: table;
}

2） 使用垂直对齐
属性
#resultheader {
    margin-left: 10px;
    color: black;
    font-size: 15px;
    vertical-align: 10px; //adjust
}

3） 使用position:relative
和top
属性
#resultheader{
    margin-left:10px;
    color:black;
    font-size: 15px;
    position: relative;
    top: -6px;
}

选择您的选项。
当您有多个元素要设置样式时，不要使用ID，而是使用类。请隔离代码以显示问题。。。。包括问题的呈现html和css…能否显示最终呈现的html给我们一段代码片段或js Fiddle当有多个元素需要设置样式时，不要使用ID，而是使用类。请隔离代码以显示问题。。。。包括问题的呈现html和css…你能显示最终呈现的html吗？给我们一段代码或js提琴