Div技巧嵌入文本？

Question

我是一个初学者，我试图显示一个div到我的单选按钮。我解释我的代码中的问题。自动完成框在ajax调用之后显示。

<input type="text" name="search" id="search" autofocus autocomplete="off" /> 
<input type="submit" id="search_button" title="Check" value="Check"/> 

//the suggesstion div move radio button to the right I need it up of the radio buttons ! 
<div id="suggesstion-box"></div> 

<label>Search by :</label> 
<input id="radio" name="radio" value="name" type="radio"/> 
<span id="radio_text"> name</span> 
<input id="radio" name="radio" value="age" type="radio"> 
<span id="radio_text"/>age</span> 

ajax.js来获取数据

$(document).ready(function(){ 
    $("#search").keyup(function(){ 
      if ($("#search").val() == "") 
      $("#suggesstion-box").hide(); 
     else{ 
     $.ajax({ 
     type: "GET", 
     url: "getinfo.php", 
     data:'keyword='+$(this).val(), 
     success: function(data){ 
        console.log(data); 
      $("#suggesstion-box").show(); 
         document.getElementById("suggesstion-box").innerHTML=data; 
      //$("#suggesstion-box").html("data"); 
      $("#search").css("background","#FFF"); 
     } 
     }); 
      }//else box not empty 

    }); 
     console.log("print it"); 
}); 

function select(val) { 
$("#search").val(val); 
$("#suggesstion-box").hide(); 
} 

getinfo.php将数据打印到意见箱

<?php 
require_once("dbcontroller.php"); 
$db_handle = new DBController(); 
//include('database.php'); 
//Sanitize the POST values 
$hint = $_GET['keyword']; 
$i = 0; 

$qry1 = "SELECT * FROM Journals where Journal_name like '" . $hint . "%' AND is_reported=1 LIMIT 3 "; 
$qry2 = "SELECT * FROM Publishers where Publisher_Name like '" . $hint . "%' AND is_reported=1 LIMIT 2;"; 
//$result = mysql_query($qry1); 
//$result2 = mysql_query($qry2); 

$data = array(); 
$result2 = $db_handle->runQuery($qry2); 
$result1 = $db_handle->runQuery($qry1); 
if (!empty($result2)) { 
    ?> 
    <ul id="country-list"> 
     <?php 
     foreach ($result2 as $info2) { 
      ?> 
      <li onClick="select('<?php echo $info2['Publisher_Name']; ?>');"><?php echo $info2['Publisher_Name']; ?></li> 
     <?php 
     } if (empty($result1)){ 
      ?> 
     </ul> 
     <?php } } 
    if (!empty($result1)) { 
     if (empty($result2)){ 

      ?> 
     <ul id="country-list"> 
     <?php 
     } 
      foreach ($result1 as $info) { 
       ?> 
       <li onClick="select('<?php echo $info['Journal_name']; ?>');"><?php echo $info['Journal_name']; ?></li> 
     <?php } ?> 
     </ul> 
<?php 
} 
?> 

s.css

#country-list{float:left;list-style:none;margin:0;padding:0;width:210px; display: inline;} 
#country-list li{padding: 10px; background:#FAFAFA;border-bottom:#F0F0F0 1px solid;} 
#country-list li:hover{background:#F0F0F0;} 
#search { 
    width: 300px; 
    height: 10px; 
    border: thin solid #00B6A8; 
    margin-top: 10px; 
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif; 
    border-collapse: collapse; 
    -webkit-box-shadow: 0px 0px 2px; 
    box-shadow: 0px 0px 2px; 
    padding: 10px; 
    display: inline; 
     //border: #F0F0F0 1px solid; 
} 
#suggesstion-box { 
    display: inline; 
} 
#radio { 
    margin-top: 10px; 
    margin-left: 30px; 
} 
#radio_text { 
    color: #545454; 
    font-size: normal; 
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif; 
    font-style: normal; 
    font-weight: normal; 
} 
#label { 
    /*margin-left: -210px;*/ 
    color: #00B6A8; 
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif; 
    font-weight: normal; 
    font-size: medium; 
} 

Answer 1

尝试：

<div id="suggesstion-box"></div> 

<div class="wrapper"> 
    <label>Search by :</label> 
    <input id="radio" name="radio" value="name" type="radio"/> 
    <span id="radio_text"> name</span> 
    <input id="radio" name="radio" value="age" type="radio"> 
    <span id="radio_text"/>age</span> 
</div> 

在CSS：

.wrapper { 
position: absolute; 
}