td單元格合并時 td寬度問題

字號:


    在對td單元格進行合并后,發(fā)現(xiàn)td顯示的寬度與設(shè)置的寬度明顯有差異(ie下)
    下面示例中,當姓名所在td的寬度是60px,如果第二行里的文字較少時,顯示正常,如果第二行里的文字較多時,則顯示不正常了
    代碼如下:
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>腳本之家</title>
    <style type="text/css">
    .mTable{width:200px;border:1px solid #666;border-collapse:collapse}
    .mTable td{border:1px solid #666}
    </style>
    </head>
    <body>
    <table width="200" cellspacing="0" cellpadding="0">
    <tr>
    <td width="60">姓名:</td>
    <td>某某</td>
    </tr>
    <tr>
    <td colspan="2">個人簡介</td>
    </tr>
    </table>
    <table width="200" cellspacing="0" cellpadding="0">
    <tr>
    <td width="60">姓名:</td>
    <td>某某</td>
    </tr>
    <tr>
    <td colspan="2">個人簡介個人簡介個人簡介</td>
    </tr>
    </table>
    </body>
    </html>
    解決方法一:(對第二列td也設(shè)置寬度)
    代碼如下:
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>腳本之家</title>
    <style type="text/css">
    .mTable{width:200px;border:1px solid #666;border-collapse:collapse}
    .mTable td{border:1px solid #666}
    </style>
    </head>
    <body>
    <table width="200" cellspacing="0" cellpadding="0">
    <tr>
    <td width="60">姓名:</td>
    <td width="140">某某</td>
    </tr>
    <tr>
    <td colspan="2">個人簡介</td>
    </tr>
    </table>
    <table width="200" cellspacing="0" cellpadding="0">
    <tr>
    <td width="60">姓名:</td>
    <td width="140">某某</td>
    </tr>
    <tr>
    <td colspan="2">個人簡介個人簡介個人簡介</td>
    </tr>
    </table>
    </body>
    </html>
    解決方法二:(設(shè)置table-layout:fixed)
    代碼如下:
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>腳本之家</title>
    <style type="text/css">
    .mTable{width:200px;border:1px solid #666;border-collapse:collapse;table-layout:fixed}
    .mTable td{border:1px solid #666}
    </style>
    </head>
    <body>
    <table width="200" cellspacing="0" cellpadding="0">
    <tr>
    <td width="60">姓名:</td>
    <td>某某</td>
    </tr>
    <tr>
    <td colspan="2">個人簡介</td>
    </tr>
    </table>
    <table width="200" cellspacing="0" cellpadding="0">
    <tr>
    <td width="60">姓名:</td>
    <td>某某</td>
    </tr>
    <tr>
    <td colspan="2">個人簡介個人簡介個人簡介</td>
    </tr>
    </table>
    </body>
    </html>