est-il possible de spécifier la cellule de table en utilisant à la fois% ET px?

Question

donné une

<table width="100%"> 
    <tr> 
     <td>Percentual<td> 
     <td>Percentual<td> 
     <td>Fixed 50px <td> 
     <td>Fixed size<td> 
     <td>Fixed size<td> 
    </tr> 
</table> 

Est-il possible d'avoir une table avec des cellules (<td>) largeur fixe (comme 50px, 20px ...) et d'autres cellules à se diviser en% (25%, 25%, 50%) l'espace libre remaning?

Je ne peux pas l'air d'être en mesure d'obtenir, puisque le% ne prenne tout l'espace disponible ...

Je ne soin de le faire fonctionner dans le navigateur Firefox Laster, mais au plus tard le chrome et à savoir serait bien trop

cela n'a pas aidé Can you mix % and px to align a table?

Answer 1

MISE à JOUR

vous ne pouvez pas faire cela avec CSS seul, vous aurez besoin d'ajouter un peu jquery comme comme celui-ci:

_width = ($('table').width() - $('#brian').width()); 

// Set widths as 'px' 
//td_width_px = (_width/3) 
//$("td:not(#brian)").css("width",td_width_px+'px'); 

// Set widths as '%'  
td_width_pCent = (((_width/3)/$('table').width()) * 100); 
$("td:not(#brian)").css("width",td_width_pCent+'%'); 

Ive Codé Ce pour vous de voir - http://jsfiddle.net/ajthomascouk/sVadG/1

NB: il peut y avoir une meilleure façon de calculer le pourcentage, mais je voulais vous obtenir une réponse.

Answer 2

Vous pouvez utiliser une flexbox CSS3. Il fonctionne comme ceci:

<div class="box"> 
    <div class="flex">Percentual</div> 
    <div class="flex">Percentual</div> 
    <div class="fixed">Fixed 50px </div> 
    <div class="fixed">Fixed size</div> 
    <div class="fixed">Fixed size</div> 
</div> 

CSS

.box { 
    display: -webkit-box; 
    display: -moz-box; 
} 

.flex { 
    -webkit-box-flex: 1; 
    -moz-box-flex: 1; 
} 

div.fixed { 
    width: 50px; 
} 

http://jsfiddle.net/DFTR4/ (redimensionner la fenêtre de votre navigateur)