Faire un td de remplissage largeur de la table
J'ai une table qui a une hauteur fixe de 50px et 100% de largeur.
À l'intérieur de cette table, j'ai deux divs, sur la même ligne, comme ceci:
<table>
<tr>
<td>
<div id="1"></div>
</td>
<td>
<div id="2"></div>
</td>
</tr>
</table>
La première div a float:left
, et le second a float:right
.
De sorte que le tableau est de 100% de la page. Je veux div2 pour l'envelopper de son contenu, et div1 pour remplir l'espace restant, de sorte que div2 est aligné à droite comme ceci:
+--------------------------------------------------------------+
| [ DIV 1 (Expands) ][ DIV 2 AND ITS CONTENTS ] |
+--------------------------------------------------------------+
et ce que j'ai actuellement, lorsque div1 a moins de contenu que d'une gamme complète:
+--------------------------------------------------------------+
| [ DIV 1 ][ DIV 2 ] |
+--------------------------------------------------------------+
Sans une table, je peux le faire fonctionner flottant à gauche et à droite directement, mais alors quand ils "se rassembler", ils se terminera sous les uns les autres au lieu de les uns à côté des autres.
EDIT: j'ai ajouté une nouvelle jsfiddle ici.
C'est l'exemple qui fonctionne.
Essayez de supprimer tous, mais l'un des liens à partir de la gauche de la div, et voir le résultat. La deuxième div doivent rester le plus droit. J'espère que j'ai expliqué moi-même.
vous n'avez pas besoin de tables jsfiddle.net/WqsTg
Je travaillais sur le jsfiddle, maintenant c'est fait, voir la modifier.
Bien que HTML5 a retiré de réglage des largeurs directement en HTML, en faveur de CSS dans votre réponse, aussi regarder
<col />
. Essayez de la définition des colonnes avec width="0*"
pour un minimum de largeur et width="100%"
pour un maximum de largeur.
OriginalL'auteur Twinone | 2013-02-13
Vous devez vous connecter pour publier un commentaire.
Utiliser le "colspan" propriété de la td. Ex:
Cette réponse est incorrecte et ne suivant pas le standard HTML.
<td>
colspan
: Cet attribut contient un entier non négatif qui indique depuis combien de colonnes de la cellule s'étend. Sa valeur par défaut est 1." Bien que HTML5 a retiré de réglage des largeurs directement dans le HTML, regarde<col />
.OriginalL'auteur tymeJV
Résolu en ajoutant le
width:100%
à la table.http://jsfiddle.net/HRT5E/1/
OriginalL'auteur Twinone
Tout d'abord, votre table ne semble pas être réglé sur toute la largeur de la page. Vous souhaitez ajouter une largeur de style ou l'attribut width de la balise.
Prochaine juste définir une largeur fixe sur la droite "div" (ou, plus précisément
<TD>
) et le premier va remplir l'espace restant.Comme d'autres l'ont souligné, le wrapper tableau semble inutile.
OriginalL'auteur JohnFx