2011-02-10 5 views
1

Je rencontre des problèmes pour faire fonctionner ma table. J'ai vraiment besoin de comprendre comment utiliser divs plus, mais maintenant, j'ai juste besoin de travailler.Problème de table CSS/largeur dynamique

Voici ce que je fais .. j'ai une seule table 3 colonne de table

colonne 1 contient un texte statique dit en fait « Sélectionner compte »
colonne 2 contient un titre en-tête
colonne 3 contient le nom du compte, sélectionnez

Colonne 1 a une largeur statique de 220px
Colonne 2 a besoin de l'en-tête pour centrer au milieu de l'écran
colonne 3 doit se développer selon la taille du texte

La table est 100% sur l'écran.

ne peut pas sembler comprendre comment le faire fonctionner .. Colonne 1 fonctionne très bien .. la colonne 3 j'ai centré droit, a sorti la largeur, mais colonne du milieu centre wont correctement ...

Tous des idées? Peut-être un moyen de le faire en utilisant un div? Raison pour laquelle j'utilisé le tableau est parce que si le navigateur est faible, ne veulent pas de colonnes à tomber sous l'autre comme ils le font avec divs

Exemple de code:

 
<table style="width: 100%" border="1"> 
    <tr> 
    <td style="width: 220px;"> 
     <span>Please Select Your Account</span> 
    </td> 
    <td valign="top" align="center"> 
     <span>HeaderTitle(Centered)</span> 
    </td> 
    <td align="right"> 
     <span>This is a really long account name need to keep dynamic</span> 
    </td> 
    </tr> 
</table> 

Pour ceux qui en ont besoin .. http://jsfiddle.net/j5C3z/6/

Répondre

4

S'il vous plaît ne emploient pas f $% & * (* g tables pour la mise en page, Si vous mettez en place un exemple de votre code je peux le convertir en un div layo ut pour vous et expliquer plus en détail ...

fixe comme mise en page DIV: http://jsfiddle.net/Mutant_Tractor/j5C3z/2/

+0

Je sais ce que tu veux dire, je déteste l'aide de tables, mais peuvent ne semblent jamais les faire fonctionner correctement comme divs, je J'adore toute aide que vous pouvez donner .. HTML ajouté – jaekie

+1

@MylesGray: 2nded, je suis toujours prêt pour une leçon de gestion DIV au lieu de tables. Il semble que j'ai de la difficulté à obtenir une distribution DIV uniforme sur tous les navigateurs. (et float: à gauche sera la mort de moi, garanti) –

+0

@BradChristie et @LeeHull Check JSFiddle ci-dessus –