將div定位在另一個div下

我有一個div，它有菜單和另一個用於搜索框。每當我在搜索框中鍵入查詢，結果（S）分別爲菜單的div下將div定位在另一個div下

error

順便說一句。我使用的Metro UI塞吉皮梅諾夫

這是從主網頁我的代碼：

<html> 
<head> 
    <!--metadata--> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> 
    <meta name="author" content="Jan Adrian Fetizanan, Philippines, Manila"> 
    <!--stylesheets--> 
    <link href="css/metro-bootstrap.css" rel="stylesheet"> 
    <link href="css/metro-bootstrap-responsive.css" rel="stylesheet"> 
    <link href="js/prettify/prettify.css" rel="stylesheet"> 
    <!--Javascripts--> 
    <script src="js/jquery/jquery.min.js"></script> 
    <script src="js/jquery/jquery.widget.min.js"></script> 
    <script src="js/jquery/jquery.mousewheel.js"></script> 
    <script src="js/jquery/jquery.dataTables.js"></script> 
    <script src="js/prettify/prettify.js"></script> 
    <!-- UI plugin --> 
    <script src="js/load-metro.js"></script> 
    <script> 
     function showResult(str) 
     { 
      if (str.length==0) 
      { 
       document.getElementById("livesearch").innerHTML=""; 
       document.getElementById("livesearch").style.border="0px"; 
       return; 
      } 
      if (window.XMLHttpRequest) 
      {// code for IE7+, Firefox, Chrome, Opera, Safari 
       xmlhttp=new XMLHttpRequest(); 
      } 
      else 
      {// code for IE6, IE5 
       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
      } 
      xmlhttp.onreadystatechange=function() 
      { 
       if (xmlhttp.readyState==4 && xmlhttp.status==200) 
       { 
        document.getElementById("livesearch").innerHTML=xmlhttp.responseText; 
        document.getElementById("livesearch").style.border="1px solid #A5ACB2"; 
       } 
      } 
      xmlhttp.open("GET","livesearch.php?q="+str,true); 
      xmlhttp.send(); 
     } 
    </script> 
    <style> 
     .container { 
      width: 1040px; 
     } 
    </style> 

    <title>EUG</title> 
</head> 
<body class="metro"> 
    <div class="container"> 
     <header class="margin20 nrm nlm"> 
      <div class="clearfix"> 
       <a class="place-left"> 
        <h1>TEST</h1> 
       </a> 
       <div class="place-right"> 
        <form> 
         <div class="input-control text size6 margin20 nrm bg-white"> 
          <input type="text" name="q" placeholder="Search..." onkeyup="showResult(this.value)"> 
          <div class="element" id="livesearch"></div> 
         </div> 
        </form> 
       </div> 
      </div> 
      <div class="main-menu-wrapper"> 
       <ul class="horizontal-menu nlm"> 
        <li><a href="#">eug</a></li> 
        <li><a href="#">shipping</a></li> 
        <li><a href="#">tracking</a></li> 
        <li><a href="#">freight</a></li> 
        <li><a href="#">location</a></li> 
        <li><a href="#">contact</a></li> 
        <li><a href="#">about</a></li> 
       </ul> 
      </div> 
     </header> 
     <div class="main-content clearfix"> 
      <div class="grid fluid"> 
       <div style="float: right; "> 
        <div class="span3"> 
         <div class="panel"> 
          <div class="panel-header bg-lightBlue"> 
           TESTING 
          </div> 
          <div class="panel-content"> 
           Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
           Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
           when an unknown printer took a galley of type and scrambled it to make a type specimen book. 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</body>

這是livesearch.php

<?php 
$xmlDoc=new DOMDocument(); 
$xmlDoc->load("links.xml"); 

$x=$xmlDoc->getElementsByTagName('link'); 

//get the q parameter from URL 
$q=$_GET["q"]; 

//lookup all links from the xml file if length of q>0 
if (strlen($q)>0) 
{ 
$hint=""; 
for($i=0; $i<($x->length); $i++) 
    { 
    $y=$x->item($i)->getElementsByTagName('title'); 
    $z=$x->item($i)->getElementsByTagName('url'); 
    if ($y->item(0)->nodeType==1) 
    { 
    //find a link matching the search text 
    if (stristr($y->item(0)->childNodes->item(0)->nodeValue,$q)) 
     { 
     if ($hint=="") 
     { 
     $hint="<a href='" . 
     $z->item(0)->childNodes->item(0)->nodeValue . 
     "' target='_blank'>" . 
     $y->item(0)->childNodes->item(0)->nodeValue . "</a>"; 
     } 
     else 
     { 
     $hint=$hint . "<br /><a href='" . 
     $z->item(0)->childNodes->item(0)->nodeValue . 
     "' target='_blank'>" . 
     $y->item(0)->childNodes->item(0)->nodeValue . "</a>"; 
     } 
     } 
    } 
    } 
} 

// Set output to "no suggestion" if no hint were found 
// or to the correct values 
if ($hint=="") 
    { 
    $response="no suggestion"; 
    } 
else 
    { 
    $response=$hint; 
    } 

//output the response 
echo $response; 
?>

來源

2014-02-26 user3326060