HTML 表格關於排版的問題

表格預設css是 table-layout:auto ，常常導致寬度超出預期設計。解決方式如下...

• 英文字左右要加上半型空白或符號，避免直接連接中文字，或是中文全型符號。
• <table>加上 table-layout:fixed ，能固定寬度，而且有加速顯示的效果: http://blog.miniasp.com/post/2009/04/20/Use-CSS-table-layout-property-to-speed-up-table-rendering.aspx
• 固定高度: 如果需要避免換行而造成高度變化: <td width=25% style="overflow:hidden" nowrap><div>文字</div></td>。至於不用px 而用%，這又是 IE6 造成的。請參考 http://www.yici.net/content/text_all/text_0/311_1.html

如果搞到每個 td 裡面要有個 div，那麼乾脆就用這篇 http://uiop7890.pixnet.net/blog/post/22445273
.tdDiv {
overflow: auto;
height: 100px; width: 200px;
clip: rect( ); }
這樣一來就不用另外設定 table 與 td 了。只是苦了美工，在 DW 無法直覺的拖拉。

順便記一下 css 文字的排版: http://www.w3schools.com/Css/css_reference.asp(可以試玩)
letter-spacing:0.2em; /* 英文字母的間距 */
word-spacing:1em; /* 英文字、中文字、全型符號的間距 */
text-indent:2em; /* 每段文章第一列縮排 */
white-space:pre-line; /* 這是在 HTML 碼模式貼文時，可以模仿 HTML 碼的換行，可惜 IE6 又不行了 */
white-space:nowrap; /* 不換行 */
line-height:1.3em; /* 每列高度，可以調整每列的距離 */
text-align 與 vertical-align 是對齊用的，後者需注意 line-height 設定值。