展开表中的单元格以填充所有未使用的行

时间:2014-01-20 11:09:12

标签: html css html-table

我有一张桌子,其中有一些表格输入

 <div id="content">
<form>
<table>
    <tr>
        <th>Nome gruppo</th><th>Superficie Totale</th></tr>
        <tr>
        <td><input type="text" id="nome_gruppo" /></td>

        <td><input type="text" id="superficie_totale" /></td>
    </tr> <tr>
        <th>Destinazione Teorica</th><th>Destinazione effettiva</th></tr>
        <tr>
        <td><input type="text" id="destinazione_teorica" /></td>

        <td><input type="text" id="destinazione_effettiva" /></td>
    </tr> <tr>
        <th>Indirizzo </th><th>via/piazza</th><th>Civico</th></tr>
        <tr>
        <td><input type="text" id="particella_toponomastica" /></td>

        <td><input type="text" id="Indirizzo" /></td>
        <td><input type="text" id="civico" /></td>
    </tr> <tr>
        <th>Info ubicazione</th></tr>
        <tr>
        <td><textarea id="info_ubicazione" ></textarea></td>
    </tr> <tr>
        <th>Note</th></tr>
        <tr>


        <td><textarea id="note" ></textarea></td>
    </tr>

 </table>

用这个css:

    table{
          border-spacing:0px;
          border-collapse:collapse;
          table-layout:fixed;
          width:600px;
     }
    tr{     
          background-color:#abba46;
    }
    th{
        background-color:#abba46;
        border-color:white;
        min-width:100%;
            border-top:2px solid;
            border-top-color:white;     
    }    
    th:first-child{
        border-top-left-radius:20px;
    }    
    th:last-child{
        border-top-right-radius:20px;
    }

它会产生这样的输出

细胞细胞
细胞细胞
细胞细胞 细胞细胞

我希望列数较少的行(如第一行)与其他行的宽度相同;就像一个“合理的风格”。

我该怎么办?

0 个答案:

没有答案