為什麼這篇html table排版鄉民發文收入到精華區：因為在html table排版這個討論話題中，有許多相關的文章在討論，這篇最有參考價值！作者santin (被雷劈)看板Web_Design標題Re: [問題] css排版問題，表格超出d...
不好意思我不太會用 BBS
你的網頁在 Firefox 上看到的結果如下
http://farm4.static.flickr.com/3532/4005235309_8a9e38f196_o.png
不知道你想要的效果是不是像下圖這樣一直往下延伸區塊來顯示資料
╭╮
│┌───────┐┌───────┐│
││ 第４棟測試 ││ 第三筆測試 ││
│└───────┘└───—───┘│
│┌───────┐┌───────┐│
││ 第二筆測試 ││ 第一筆測試 ││
│└───────┘└───────┘│
│┌───────┐┌───────┐│
││ 其他的資料 ││ 其他的資料 ││
│└───────┘└───────┘│
│ 第一頁 ▲ 上一頁 下一頁 ▼ 最後頁 │
╰──────────────────╯
如果是的話，以動最少的方式來修改
可以在 table 加個 class 讓 css 控制
（table的html語法我省略了，重點是在 class="自定名稱"）
----------------------------------------
<div class="style1">
<table class="grid">第4棟測試</table>
<table class="grid">第三筆測試</table>
<table class="grid">第二筆測試</table>
<table class="grid">第一筆浿試</table>
<div class="pagenav">第一頁........最後頁</div>
</div>
----------------------------------------
這樣就可以在 css 中讓他們一個個排列好
（上圖的最外框圓角矩形表示div.style1）
.style1 {
width: 760px;
}
.grid {
width: 368px;
height: 153px;
float: left;
margin: 10px;
}
.pagenav {
clear: both;
}
包在 table 外的 div 設個寬度可能會好點
原本裝資料的 table 設定 float:left;
為了防止下面資料被擠上來，所以接在後面的 pagenav（也是我自己加的class）
要加上 clear: both;
這應該是比較簡單的解決方式（麻煩一點就重寫了）
不過搞不好 style1 的 div 設寬度就解決了XD
我本身是做視覺設計的，所以這方面懂得不多
也請版上其他高手多多指教^^"
※ 引述《sss5 (屁)》之銘言：
: 我是用div包table，用css去控制，但還是會跑出這樣的結果..
: http://0rz.tw/56jdG
: (重點! 在firefox底下是正常的!)
: 正常一列2筆資料，第3筆要跳到第二列第一欄，但他會無限延申..
: 弄很久還是不清楚哪裡的問題!??
: 下面是主區塊apdiv2裡的程式碼...
: 麻煩比較懂css的幫我找問題! 謝謝!!
: (div名稱是 "apDiv2")
: <div align="center" class="style1">
: <p> </p>
: <?php do { ?>
: <table width="368" height="153" border="0" align="left">
: <tr>
: <td width="198" rowspan="6" background="images/himg.jpg"><div align="center"><a href="house1.php?H_ID=<?php echo $row_Recordset1['H_ID']; ?>"><img src="images/house.jpg" width="180" height="135" border="0" /></a></div></td>
: <td width="160" height="21"><img src="images/arrow_330.gif" width="8" height="8" /><?php echo $row_Recordset1['H_Name']; ?></td>
: </tr>
: <tr>
: <td height="21"><img src="images/line.jpg" width="160" height="6" /></td>
: </tr>
: <tr>
: <td height="21">地區：<?php echo $row_Recordset1['Addr']; ?></td>
: </tr>
: <tr>
: <td height="21">價格：<?php echo $row_Recordset1['Price']; ?></td>
: </tr>
: <tr>
: <td height="33"> </td>
: </tr>
: <tr>
: <td height="21"> </td>
: </tr>
: </table>
: <?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?><p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p> </p>
: <p align="center">第一頁 ▲ 上ㄧ頁
: <select name="page" id="page">
: </select>
: 下一頁 ▼ 最後頁 | 1 / 1</p>
: <p><br />
: <span class="style1"> </span></p>
: </div>
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 220.136.81.71
※ 編輯: santin 來自: 220.136.81.71 (10/13 03:59)
推 sss5:果然是高手..呵，這樣只要再調整一下width，就可以了 10/13 07:33
→ sss5:謝謝~~~一點小錢請接受XD 10/13 07:34
→ santin:我的確是沒仔細算過 XD 也謝謝你的紅包^^ 10/13 15:22