DIV的高度自動調整

我正在使用div的en css代碼，以從mysql數據庫中獲取一些值。DIV的高度自動調整

它工作正常。但是，如果數據庫中的值超過1行，則帶有div的表格看起來不太好。

這是我正在使用的代碼：

$result = mysql_query("SELECT * FROM boxen "); 
    while ($row = mysql_fetch_assoc($result)) 
    { 
    echo '<div class="a naam">'; 
    echo '<a href="boxen.php?boxid=' . $row['ID'] . '">' . $row['naam'] . '</a>'; 
    echo '</div>'; 

    echo '<div class="a datum">'; 
    echo $row['datum']; 
    echo '</div>'; 

    echo '<div class="a land">'; 
    echo $row['land']; 
    echo '</div>'; 

    echo '<div class="a naam">'; 
    echo $row['starter']; 
    echo '</div>'; 
    }

CSS代碼調整顏色和寬度。短：我如何解決高度？

P.s.我在stackoverflow上搜索，但沒有發現可以幫助我，也許我使用了錯誤的關鍵字？

編輯：

<div class="inhoud"> 
<h2>Inhoud van de box: </h2><br /> 
<div class="header naam"> 
    Naam product 
</div> 
<div class="header omschrijving"> 
    Omschrijving 
</div> 
<div class="header aantal"> 
    Aantal 
</div> 
<div class="header datum"> 
    Datum toegevoegd 
</div> 
<div class="header naam"> 
    Naam toeveoger 
</div> 
<div class="header datum"> 
    Datum verwijderd 
    </div> 
<div class="header naamVerwijderaar"> 
    Naam verwijdereraar 
</div> 
<div class="header icon"> 
    &nbsp; 
</div> 
<div class="header icon"> 
    &nbsp; 
</div> 
<div class="header icon"> 
    SAMPLE SAMPLE SAMPLE SAMPLE SAMPLE 
</div>

這是頭，但它有同樣的問題。最後一列將有2行，如果我添加另一行，它會變得非常混亂。

而且CSS代碼：

/* Algemeen voor header*/ 
.header { 
    background-color:#4DA0FF; 
    float:left; 
    margin-left:4px; 
    margin-bottom:4px; 
    color:white; 

} 
/* END HEADER*/ 
/* ALGEMEEN OVERIZCHT*/ 
/* naam */ 
.naam{ 
width:200px; 
height:auto; 
} 
/* naam die het product er uit heeft gehaald*/ 
.naamVerwijderaar{ 
width:210px; 
height:auto; 

} 
/* datum */ 
.datum{ 
width:150px; 
height:auto; 

} 


/* omschrijinvg */ 
.omschrijving{ 
    width:200px; 
    height:auto; 

} 
.aantal { 
    width:80px; 
    height:auto; 

} 
/* land */ 
.land{ 
width:150px; 
height:auto; 

} 
inhoud{ 
    width:1305px; 
}

我並不需要所有的CSS代碼，這個例子！

來源

2012-05-19 LEDfan

歡迎堆棧溢出！請停止使用古老的'mysql_ *'函數編寫新代碼。他們不再被維護，社區已經開始[棄用流程]（http://news.php.net/php.internals/53799）。相反，您應該瞭解準備好的語句並使用[PDO]（http://php.net/pdo）或[MySQLi]（http://php.net/mysqli）。如果你關心學習，[這裏是一個很好的PDO相關教程]（http://wiki.hashphp.org/PDO_Tutorial_for_MySQL_Developers）。 –

Tnx！我知道我需要使用它！我找到了一個很好的教程，我會盡快開始學習，但我需要先解決這個問題。但我會用你的建議！ – LEDfan

請向我們展示從腳本生成的HTML，以及您在其上使用的CSS代碼。 –

你想爲這種事情的表。

當用於正確類型的數據（表格數據，即最適合表格的數據類型）時，表格並非全是邪惡的，表格完全可以接受。

示例代碼：

<style type="text/css"> 
    th { 
     background-color: rgb(77, 160, 255); 
     margin-left:  4px; 
     margin-bottom: 4px; 
     color:   rgb(255, 255, 255); 
    } 
    table caption { 
     font-size: 2em; 
     font-weight: bold; 
    } 
</style> 
<table> 
    <caption>Inoud van de box:</caption> 
    <thead> 
     <tr> 
      <th>Naam product</th> 
      <th>Omschrijving</th> 
      <th>Antal</th> 
      <th>Datum toegevoegd</th> 
      <th>Naam toevegoer</th> 
      <th>Datum verwijderd</th> 
      <th>Naam verwijderd</th> 
      <th>&nbsp;</th> 
      <th>&nbsp;</th> 
      <th>SAMPLE SAMPLE SAMPLE SAMPLE</th> 
     </tr> 
    </thead> 
</table>

來源

2012-05-19 13:38:56

我同意那個！你不需要每個人都無表，這些都是完全可以接受的HTML元素，並且結構良好。 – benqus

謝謝！我將使用表格，並且我將學習PDO。 – LEDfan

@LEDfan：沒問題。如果我的答案解決了您的問題，請考慮通過點擊此答案的投票計數下方的大綠色勾號來接受此問題。 –

DIV的高度自動調整

回答

相關問題