2011-06-30 89 views
2

我試圖將一些內容放在div中。由於某些原因,它顯示在div下面而不是在div內。文本顯示在div外

.scrollme 
{ 
    height: 200px; 
    width: 300px; 
    overflow: auto; 
    border: 1px solid #666; 
    background-color: #ccc; 
    padding: 8px; 
} 

echo '<table width="100%"> 
     <tr> 
      <td colspan="2" class="pulldown_top_table">'.$lang['logboek'].' <a href="#?w=700" rel="popup_add_log" class="poplight" title="'.$lang['form_add'].'"><img align="center" src="images/icon/new_sm.png" onClick=\'document.getElementById("ifr_7").src="dossier_add_log.php?id='.$q.'";\' /></a></td> 
     </tr> 
     <div class="scrollme">'; 

     while($row = mysql_fetch_array($res)) 
     { 
      // maak style 
      if($row['soort'] == 'systeem' || $row['soort'] == 'folder') 
      { 
       $style = 'style="line-height: 10px; color: grey;"'; 
      } 
      else 
      { 
       $style = 'style="line-height: 10px; color: black;"'; 
      } 

      echo '<tr '.$style.' title="'.$row['naam'].' '.$row['updated_title'].'"> 
        <td valign="top"width="35"><font size="1">'.$row['updated'].'</font></td> 
        <td><font size="1">'.nl2br($row['omschrijving']).'</font></td>'; 
       echo '</tr>'; 
     } 
echo '</div> 
     </table>'; 

enter image description here

生成的HTML的部分始於:

<table width="100%"> 

     <tr> 

      <td colspan="2" class="pulldown_top_table"> <a href="#?w=700" rel="popup_add_log" class="poplight" title=""><img align="center" src="images/icon/new_sm.png" onClick='document.getElementById("ifr_7").src="dossier_add_log.php?id=256";' /></a></td> 

     </tr> 

     <div class="scrollme"><tr style="line-height: 10px; color: grey;" title="Mark Ruiter 30-06-2011 13:11"> 

        <td valign="top"width="35"><font size="1">30-06</font></td> 

        <td><font size="1">Producten van product gekopieerd naar map subfolder 2</font></td></tr><tr style="line-height: 10px; color: grey;" title="Mark Ruiter 30-06-2011 12:41"> 

,結尾是:

<td><font size="1">Dossier aangemaakt met:<br /> 
    Klantreferente: 2119<br /> 
    Bewerkingen: nvt<br /> 
    Materiaal: S235<br /> 
    Dikte: 1<br /> 
    Attest: geen</font></td></tr></div> 

     </table> 

請幫助。

+0

感謝您發佈您的CSS。你還可以發佈你的HTML標記的相關部分嗎?一個JSFiddle可能也很好,所以我們可以看到這個行爲。 –

+0

我們需要更多的代碼來理解這一點。 – Karolis

+0

你可以發佈插入測試的html和php嗎? – shanethehat

回答

3

您不能插入一個DIV像這樣的表內:

表中有TR(行)和TD(列),所以如果要插入一個DIV你必須把它裏面的元素

<table><tr><td><div /></td></tr></table> 

OR

地方的DIV中的全表:

<div><table>...</table></div> 
+0

謝謝@spuas – Muiter

2

您不能將部分表格行放入div。

您需要將表格拆分爲兩部分。一個用於標題的表格,以及一個可滾動的div與數據的表格。

0

的div沒有t除了單元格內部(td和th)之外,有效的內部表格。如果您需要將表格分成小節,則可以使用add,tfoot和tbody。 thead和tfoot元素分別定義表格的頁眉和頁腳,並且tbody定義一個內容塊。你可以在表中有1個thead,1個tfoot和任意數量的tbody元素。

雖然我不確定你是否可以滾動tbody。至少沒有一個適用於所有瀏覽器