web-dev-qa-db-fra.com

Faire une taille fixe td (largeur, hauteur) tandis que le reste des td peut se développer

Savez-vous, comment fixer la taille d'une largeur et d'une hauteur td dans un tableau en permettant au reste du td sur la table de se développer selon les besoins?

Le problème est que lorsqu'il y a des données à l'intérieur des td, elles ne rétréciront pas plus que les données, mais si elles sont vides, elles rétréciront complètement, si vous développez la fenêtre, le td se développera.

Je voudrais conserver la taille du td, que vous agrandissiez ou réduisiez la fenêtre et que le td contienne des données ou non.

Je dois également garder le reste des td en mesure de se développer à mesure que vous développez la fenêtre.

La table tableContainerRow2 est celle dont j'ai besoin pour qu'elle soit de taille fixe. par exemple.

<style>
    .divContainer {
        margin:10px;
        background-color:#C7D8EE;
        border:2px solid #0076BF;
        text-align:left;    
    }

    .tableContainer {
        color:#0076BF;
        margin: -10px 0px -10px 0px;
        border-spacing: 10px;
        empty-cells:show;
        width:90%;
    }

    .tableContainerRow2 {
        background-color:white;
        border:2px solid #0076BF;
    }
</style>

<div class="divContainer">
    <table class="tableContainer" cellspacing="10px">
        <tr>
            <td width="18%" style="white-space:nowrap;" >NHS Number</td>
            <td width="17%">&#160;</td>
            <td width="10%"  style="white-space:nowrap;">Date of Visit</td>
            <td width="10%">&#160;</td>
            <td colspan="3" style="white-space:nowrap;">Care Time Started</td>
            <td width="4%">&#160;</td>
            <td width="5%">&#160;</td>
            <td width="25%" rowspan="2" style="font-weight:bold;vertical-align:middle;white-space:nowrap;">Tick when<br/> care starts</td>
        </tr>
        <tr >
            <td width="18%" class="tableContainerRow2">&#160;0123456789</td>
            <td width="17%">&#160;</td>
            <td width="10%" class="tableContainerRow2">&#160;12/12/09</td>
            <td width="10%">&#160;</td>
            <td width="5%" class="tableContainerRow2">&#160;12</td>
            <td width="1%" >&#160;:</td>
            <td width="5%" class="tableContainerRow2">&#160;10</td>                       
            <td width="4%">&#160;</td>
            <td width="5%">&#160;&#9745;</td>
            <td width="10%" >&#160;</td>
        </tr>
    </table>
</div>
htmlhtml-tablealignment
10
Amra

définissez simplement la largeur du td/colonne que vous souhaitez corriger et le reste se développera.

<td width="200"></td>
13
spatel

Cela prendra soin du td vide:

<td style="min-width: 20px;"></td>
5
claw68